Quelles sont les méthodes d'itération des tableaux dans es6 ?

Méthode itérative : 1. map, utilisée pour mapper des tableaux selon certaines règles pour obtenir un nouveau tableau après le mappage ; 2. filter, utilisée pour filtrer les éléments en fonction des conditions de jugement 3. forEach, ce qui équivaut à utiliser une boucle for ; pour parcourir le tableau ; 4. some, utilisé pour déterminer s'il y a des éléments dans le tableau qui remplissent les conditions ; 5. each, utilisé pour déterminer si tous les éléments du tableau remplissent les conditions 6. findIndex, utilisé pour trouver l'indice de l'élément ; ; 7. réduire, qui peut parcourir les éléments du tableau et exécuter la fonction de rappel une fois pour chaque élément.

L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.

Le tableau devrait être le type le plus couramment utilisé dans es6. Comme les tableaux dans d'autres langages, il s'agit également d'un ensemble de données ordonnées, mais la différence est que chaque emplacement du tableau dans le tableau ECMAscript peut stocker n'importe quel type de données. signifie que nous pouvons stocker une chaîne dans le premier emplacement, une valeur dans le deuxième et un objet dans le troisième. La méthode la plus couramment utilisée dans les tableaux ECMAscript est la méthode d'itération. Permettez-moi de la présenter en détail ci-dessous.

7 méthodes d'itération pour les tableaux ES6

1. La méthode map()

transmet chaque élément du tableau dans la fonction en cours d'exécution et renvoie un tableau composé des résultats de chaque appel de fonction.

Fonction : Mappez le tableau selon une certaine règle pour obtenir le nouveau tableau après le mappage

Scénarios d'application :

• (1) Tous les éléments du tableau * 0,8

• (2) Convertissez les objets js en le tableau, mapper à la chaîne HTML

Exemple :

 const arr = [10,20,30,40,50]
  // 完整写法
  // let res = arr.map((item,index)=>{
  //     return item * 0.8
  //   })
  // 熟练写法
   let res = arr.map(item=>item*0.8)
    console.log(res)
  // 返回处理后的新数组   [8, 16, 24, 32, 40]

2, méthode filter()

transmet la fonction en cours d'exécution à chaque élément du tableau et les éléments que la fonction renvoie vrais formera un tableau et reviendra.

Fonction : filtre basé sur les conditions jugées.

Scénarios d'application :

• (1) Filtrer les nombres pairs dans le tableau

• (2) Filtrer les prix des produits

Exemple :

 //需求： 筛选数组里的偶数
    const arr = [10,20,33,44,55]
    // let res =  arr.filter(item=>{
    //   if(item % 2 == 0){
    //     return true
    //   } else{
    //     return false
    //   }
    // })
    // console.log(res)
    let res1 = arr.filter(item => item % 2==0)
    console.log(res1) // [10, 20, 44]

3.

Passez chaque élément du tableau dans la fonction en cours d'exécution et il n'y a pas de valeur de retour.

Fonction : équivalente à une autre façon d'écrire une boucle for

Scénario d'application : traversée d'un tableau

Exemple :

 // 类似for循环遍历
      const arr = [13,22,10,55,60]
      arr.forEach((item,index)=>{
        console.log(item,index)
        // item->数组里每一个元素
        // index->对应的下标
      })

4 méthode some()

passe dans chaque élément du tableau. et exécute Function, si une fonction renvoie vrai, alors cette méthode renvoie vrai.

Fonction : Déterminer s'il y a des éléments dans le tableau qui remplissent les conditions (OU logique ||, n'importe qui peut être satisfait)

Scénarios d'application :

• (1) Déterminer s'il y a des nombres impairs dans le tableau

• (2) Jugement non vide : Déterminez s'il existe un élément avec une valeur vide dans le tableau du formulaire. Exemple : Déterminez s'il existe un nombre impair dans la fonction en cours d'exécution. Si chaque élément renvoie vrai, alors cette méthode. est vrai.

Fonction : Déterminer si tous les éléments du tableau remplissent les conditions (logique &&, tous satisfaits)

Scénarios d'application :

(1) Déterminer si tous les éléments du tableau sont des nombres pairs ( 2) Idée de changement : si tous les paniers sont sélectionnés

Exemple : Déterminer si tous sont des nombres pairs

 // 判断是否有奇数
    const arr = [10,20,30,40,50]
  //  let res =  arr.some(item=>{
  //     if(item % 2 == 1){
  //       return true
  //     } else{
  //       return false
  //     }
  //   })
    let res = arr.some(item =>item % 2 == 1)
    console.log(res)
   //  true: 有满足条件的元素
   //  false: 没有满足条件的元素

• Méthode findIndex()

• Fonction :

  Rechercher l'indice de l'élément

.

Scénario d'application :

(1) Si le tableau est un type valeur, recherchez l'indice de l'élément : arr.indexOf(element)(2) Si le tableau est un type référence, recherchez l'élément indice : arr. findIndex()

Exemple :

 // 判断是否全是偶数
      const arr = [10,20,30,40,50]
  //  let res =  arr.some(item=>{
  //     if(item % 2 == 1){
  //       return true
  //     } else{
  //       return false
  //     }
  //   })
    let res = arr.every(item =>item % 2 == 0)
    console.log(res)
   // true: 所有满足都满足条件
   // false: 有元素不满足条件

• 7, méthode reduction()

• Fonction : Parcourez les éléments du tableau et exécutez une fonction de rappel pour chaque élément
  Scénario d'application : Somme du tableau/Moyenne/Maximum/Minimum

Exemple :

 const arr = [10,20,30,40,50]
   let res =  arr.reduce((sum,item,index)=>{
      return sum + item
      // console.log(sum,item,index)
    },0)

方法的区别与细节

every()和some()

这些方法中，every()和some()是最相似的，都是从数组中搜素符合某个条件的元素。对every()来说，传入的参数必须对每一项都返回true，它才会返回true。而对于some()来说，只要有一项让传入的函数返回true，它就返回true，下面举个例子：

let numbers = [2,1,4,3,5,4,3];

let everyResult = numbers.every((item,index,array) => item >2);
console.log(everyResult);  // false

let someResult = numbers.some((item,index,array) => item >2);
console.log(someResult);  // true

filter()方法

这个方法基于给定的函数来决定每一项是否应该包含在它返回的数组中。例如：

let numbers = [2,1,4,3,5,4,3];
let filterResult = numbers.filter((item,index,array) => item >2);
console.log(filterResult);  // 4,3,5,4,3

这里filter返回的数组包含了4,3,5,4,3，因为只有对这些项传入的函数才返回 true，这个方法非常适合从数组中筛选满足给定条件的元素，也是非常常用的迭代方法。

map()

map()方法也是返回一个数组。这个数组的每一项都是对原始数组中同样位置的元素运行传入函数而返回的结果，例如，可以将数组中的每一项都乘以2，并返回包含所有结果的数组，如下：

let numbers = [2,1,4,3];
let mapResult = numbers.map((item,index,array) => item *2);
console.log(mapResult);  // 4,2,8,6

这个方法返回的数组包含了原始数组中每给数值乘以2的结果。这个方法很适应于创建一个与原数组一一对应的新数组。

forEach()

最后看一看forEach这个方法，这个方法只会对每一项运行传入的函数，没有返回值。其实，本质上，forEach()方法相当于使用for循环遍历数组。例如：

let numbers = [2,1,4,3];
numbers.forEach((item,index,array) => {
console.log(item)
}); // 2,1,4,3

【相关推荐：javascript视频教程、编程视频】

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!