Résumé de six exemples d'utilisation de tableaux JS

Dans le processus d'apprentissage de js, il est nécessaire de maîtriser les méthodes des tableaux js. J'ai résumé ici les méthodes couramment utilisées dans les tableaux js, afin que chacun puisse apprendre les uns des autres. Sans plus attendre, passons directement au texte principal.

1. Méthodes héritées par les objets js

Array est un objet spécial qui hérite de toString() et toLocaleString( de l'objet Object ) et la méthode valueOf()

1.toString()

la méthode toString renvoie une chaîne délimitée par des symboles concaténée par chaque valeur du tableau. La chaîne est la même que. la chaîne renvoyée par join() sans paramètres

[1,2,3].toString()//'1,2,3'
['a','b','c'].toString()//'a,b,c'
[1,[2,3]].toString()//'1,2,3'

2.toLocaleString()

toLocaleString() est toString() La version localisée, dans des conditions normales, est identique à celui renvoyé par toString() Lorsque le nombre atteint plus de 3 chiffres, il est automatiquement formaté et la date peut également être formatée

var a = 3333; a.toLocaleString()//3,333
var b = new Date; b.toLocaleString()//2018/7/13 下午3:43:39

3.valueOf()

valueOf() se renvoie lorsqu'il s'agit d'objets de tableau

var a = [1,2,3]; a.valueOf()//[1,2,3];
a.valueOf() instanceOf() Array//true

2. Méthode de conversion de tableau js

<🎜. >1.join()

Array.join() est l'opération inverse de Array.split(). Le premier fusionne les tableaux en un seul dans les unités de paramètre (la valeur par défaut est la virgule) String, le second est. pour couper la chaîne dans un tableau. Prend en charge les tableaux et les objets de type tableau, mais ne prend pas en charge les objets

var a = [1,2,3,4,5]; a.join()//'1,2,3,4,5'
var b = [1,undefined,2,null,3]; b.join()//'1,,2,,3'
var c = Array.prototype; c.join.call('hello','-')//'h-e-l-l-o'
var d = {1:'a',2:'b',length:3}; d.join()//'a,b'
var e = {1:'a',2:'b'}; e.join()//''

3. Méthode de fonctionnement de la structure de données du tableau js

Les données La structure du tableau est divisée en structure de pile (dernier entré, dernier sorti) et structure de file d'attente (premier entré, premier sorti)

Structure de pile (dernier entré, dernier sorti) :

1.push()

push() ajoute un nombre quelconque de paramètres à la fin un par un, change le tableau d'origine, modifie la longueur du tableau et renvoie

var a = [1,2]; a.push('11,22') - a//3 - [1,2,33,44]
var b = [3,4]; a.push([33.44]) - a//2 - [1,2,[33,44]]
Array.prototype.push.apply(a,b)//[1,2,3,4]
Array.prototype.push.call(a,b)//[1,2,[3,4]]

push() peut également ajouter au paramètre objet. Après l'ajout, l'objet deviendra un objet tableau. La clé de l'élément nouvellement ajouté correspond à l'index du tableau, et l'objet a un attribut de longueur

var c = {}; .call(c,1) //{0:1,length:1}

2.pop()

pop() supprime le dernier élément dans le tableau et renvoie la longueur du tableau, puis modifiez la longueur du tableau pour changer la structure de file d'attente du tableau d'origine

var a = [1,2,3]; a.pop() - a//3 - [1,2];
//如果数组本身是空数组，则返回undefined
var b = []; b.pop()//undefined

(avant, avant):

1.shift()

shift() supprime le premier élément du tableau, renvoie l'élément supprimé, puis modifie la longueur du tableau pour changer le tableau

var a = [1,2,3]; a.shift() - a//1 - [2,3];

2.unshift()

unshift() ajoute n'importe quel paramètre à la position de départ du tableau pour modifier la longueur du tableau, et renvoie la longueur du tableau pour changer le tableau

var a = [1,2,3]; a.unshift(4,5) - a//5 - [1,2,3,4,5]

4. méthode de tri des tableaux js

1.reverse()

reverse( ) est utilisé pour inverser l'ordre du tableau, modifier le tableau d'origine et renvoyer le tableau actuel

　var a = [1,2,4,3,5]; a.reverse()// [5,3,4,2,1];

2.sort()

sort() change le tableau par ordre croissant par défaut, et le tri appellera toString()

pour chaque élément du tableau par défaut

var a = [1,2,3,4,5]; a.sort() //[1,2,3,4,5]
var b = [1,2,12,13]; c.sort() //[1,12,13,2]
var c = [1,2,'1a','2b']; c.sort() //[1,'1a',2,'2b'];

Si le tableau contient un défini, undéfini sera trié jusqu'à la fin

<🎜. >

Si le tri a des paramètres (le paramètre doit être une fonction) ; si la valeur renvoyée par la fonction est un nombre positif ou si un paramètre moins le deuxième paramètre est dans l'ordre positif, sinon c'est dans l'ordre inverse. Si la chaîne est présente, elle sera minime. Mettez-le dans la position de départ dans l'ordre

var d = [1,3,undefined,2]; d.sort() //[1,2,3,undefined]

Si le paramètre de tri est un nombre aléatoire positif ou négatif renvoyé par la fonction, l'ordre du tableau sera aléatoire

function sortNumber(a,b){
　　return b-a
}
var e = [1,2,3]; e.sort(sortNumber)//[3,2,1]; 
var f = ['1a',1,'2b',2,3]; f.sort()//['1a','2b',3,2,1];

function sortRandom(a,b){
　　return Math.random()-0.5
}
var g = [1,2,3,4,5]; g.sort(sortRandom)//[2,1,5,4,3]（此为随机顺序）

3. concat()

La méthode concat() crée un nouveau tableau basé sur le tableau actuel et place les paramètres reçus à la fin, sans affecter le tableau d'origine

var a = [1,2]; b = [3,4]; a.concat - a//[1,2,3,4] - [1,2];五.创建子数组方法

4 La méthode .slice()

slice() intercepte la position de départ du premier paramètre et le chiffre de fin du deuxième paramètre. et créez un nouveau tableau. S'il n'y a pas de paramètres, il s'agit d'intercepter toutes les

var a = [1,2,3,4,5];a.slice(2,4)//[3,4,5]
var a = [1,2,3,4,5];a.slice(2)//[3,4,5]
var a = [1,2,3,4,5];a.slice(-3)//[3,4,5] 
var a = [3,4,5];a.slice()//[3,4,5]

Méthode de suppression du tableau 5.js

1.splice ()

splice() reçoit trois paramètres. Le premier paramètre est requis pour la position. Le deuxième paramètre est requis pour le numéro à supprimer. S'il n'y a qu'un seul paramètre, tous les tableaux le seront. supprimé. Le deuxième paramètre sera supprimé. Les paramètres suivants sont facultatifs pour les nouveaux éléments. Ce qui est renvoyé est le tableau supprimé

var a = [1,2,3]; a.splice(2,0,1)-a//[]-[1,2,1,3];
var b = [1,2,3]; a.splice(2,1,1)-a//[3]-[1,2,1];
var c = [1,2,3]; a.splice(2)-a//[1,2,3]-[]
var d = [1,2,3]; a.splice(2,1,4,5)-a//[3]-[1,2,4,5]

2.indexOf()

indexOf() renvoie la position où le premier paramètre apparaît pour la première fois. n apparaît, ce qui est renvoyé c'est que l'élément avant le nième élément ne compte pas s'il apparaît pour la première fois

var a = ['a','b','c',a,2,3]; a.indexOf('a')//0
var a = ['a','b','c',a,2,3]; a.indexOf('a',1)//4
var a = ['a','b','c',1,2,3]; a.indexOf('a',-5)//0

3.lastIndexOf()

La différence entre lastIndexOf() et indexOf() est : recherche de droite à gauche

var a = ['a','b','c',a,2,3]; a.indexOf('a')//4
var a = ['a','b','c',a,2,3]; a.indexOf('a'，1)//0
var a = ['a','b','c',a,2,3]; a.indexOf('a'，-1)//0

Méthode de fusion de tableaux 6.js

1.reduce()

Le premier paramètre de la méthode réduire() consiste à parcourir le tableau de fonctions spécifié et à le combiner dans un formulaire personnalisé pour générer une valeur unique. Il reçoit quatre paramètres (variable initiale, variable actuelle, index actuel, objet tableau d'origine). Le deuxième paramètre de réduire spécifie une valeur initiale à saisir.

var a = [1,2,3,4,5];
a.reduce(function(x,y){return x+y}) // 15
a.reduce(function(x,y){return x+y},3)//18

2.reduceRight()

reduceRight() est différent de réduire() en ce sens que la valeur de l'indice va de haut en bas

a.reduce(function(x,y){console.log(x,y);return x+y},0)
// 5,4 9,3 12,2 14,1 15,0

Méthodes d'itération du tableau Seven.js

1.map()

map() donne à chacun élément du tableau de fonctions Un élément exécute la fonction spécifiée et renvoie les résultats de chaque appel de fonction sous forme de tableau

var a = [1,2,3]; a.map(function(item,index,arr){return item*2})
//[2,4,6]
var b = ['aa','bb','cc'];
a.map(function(item,index,b){return this[item]})
//['aa','bb','cc'];

map()日常中多用于去解析对象中的属性

var c = {[name:1,value:2],[name:11,value:22]}
c.map(function(item){return item.name})//[1,11]

2.forEach()

forEach()给函数数组的每一项运行指定的函数(于map()对比不同于没有返回值)。forEach()可接受第二参数，用来改变this的指向。

var a = {
    name:'111'，
    arr:[1,2,3],
    value:function(){
        console.log(this);
        this.arr.forEach(function(){
        console.log(this);
        })
    }
}//循环外this指向value方法，循环内指向a对象
var b = {
　　name:'111'，
　　arr:[1,2,3],
　　value:function(){
　　　　console.log(this);
　　　　this.arr.forEach(function(){
　　　　　　console.log(this);
　　　　}，this)
　　}
}//全文的this全部都指向对象a

3.filter()

filter()给函数数组的每一项运行指定的函数，并返回制定规则返回True的项的数组。该方法多用于查询,第二个参数值指定this指向

var a = [1,2,3];a.filter(function(item){return item>1)//[2,3];

4.some()

filter()给函数数组的每一项运行指定的函数进行筛选，如果都返回false，则返回false。反之则返回true

a = [1,2,3,4,5];
a.some(function(item){return item === 3;})//true
a.some(function(item){return item === 6;})//false

5.every()

every()给函数数组的每一项运行指定的函数进行筛选，如果有返回false，则返回false。反之如果全部返回true，则返回true;空数组会返回true

a = [1,2,3,4,5];
a.every(function(item){return item === 3;})//false
a.every(function(item){return item < 6;})//true

相关推荐：

JS中数组重排序方法

js数组方法

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!