Résumé de six exemples d'utilisation de tableaux JS-js tutoriel-php.cn

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()//&#39;1,2,3&#39;
[&#39;a&#39;,&#39;b&#39;,&#39;c&#39;].toString()//&#39;a,b,c&#39;
[1,[2,3]].toString()//&#39;1,2,3&#39;

Copier après la connexion

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

Copier après la connexion

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

Copier après la connexion

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()//&#39;1,2,3,4,5&#39;
var b = [1,undefined,2,null,3]; b.join()//&#39;1,,2,,3&#39;
var c = Array.prototype; c.join.call(&#39;hello&#39;,&#39;-&#39;)//&#39;h-e-l-l-o&#39;
var d = {1:&#39;a&#39;,2:&#39;b&#39;,length:3}; d.join()//&#39;a,b&#39;
var e = {1:&#39;a&#39;,2:&#39;b&#39;}; e.join()//&#39;&#39;

Copier après la connexion

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(&#39;11,22&#39;) - 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]]

Copier après la connexion

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

Copier après la connexion

(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];

Copier après la connexion

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]

Copier après la connexion

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];

Copier après la connexion

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,&#39;1a&#39;,&#39;2b&#39;]; c.sort() //[1,&#39;1a&#39;,2,&#39;2b&#39;];

Copier après la connexion

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]

Copier après la connexion

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 = [&#39;1a&#39;,1,&#39;2b&#39;,2,3]; f.sort()//[&#39;1a&#39;,&#39;2b&#39;,3,2,1];

Copier après la connexion

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

Copier après la connexion

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];五.创建子数组方法

Copier après la connexion

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]

Copier après la connexion

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]

Copier après la connexion

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 = [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,a,2,3]; a.indexOf(&#39;a&#39;)//0
var a = [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,a,2,3]; a.indexOf(&#39;a&#39;,1)//4
var a = [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,1,2,3]; a.indexOf(&#39;a&#39;,-5)//0

Copier après la connexion

3.lastIndexOf()

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

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

Copier après la connexion

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

Copier après la connexion

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

Copier après la connexion

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 = [&#39;aa&#39;,&#39;bb&#39;,&#39;cc&#39;];
a.map(function(item,index,b){return this[item]})
//[&#39;aa&#39;,&#39;bb&#39;,&#39;cc&#39;];

Copier après la connexion

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

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

Copier après la connexion

2.forEach()

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

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

Copier après la connexion

3.filter()

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

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

Copier après la connexion

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

Copier après la connexion

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

Copier après la connexion