Méthodes d'itération des tableaux en JS : filtrer, réduire, tous les, certains

Les méthodes d'itération des tableaux en JS sont forEach, cartographier, filtrer, réduire, chaque, certains

Dans le processus quotidien de traitement des tableaux JS, nous utilisons généralement l'implémentation des boucles for. . Ce qui suit résume certaines méthodes d'itération de tableau couramment utilisées autres que les boucles for

forEach (loop)

Laissez chaque élément du tableau faire une chose séparément Things

let a = [1,2,3];
a.forEach(function(value,i){
    console.log("第" + (i + 1) + "项 :" +  value)
})
// 第1项 :1
// 第2项 :2
// 第3项 :3

map (mapping)

est similaire à la fonction forEach, mais map a une valeur de retour et génère un nouveau tableau sans changer le tableau d'origine

let a = [1,2,3];
a.map(function(value,i){
    return value * 2
})
// 第1项 :2
// 第2项 :4
// 第3项 :6

Comparaison entre map et forEach :

// 没有返回值的forEach:
let a = [1, 2, 3];
a = a.forEach(function (value, i) {
    return value * 2 // undefine
})
// 有返回值的map:
let b = [1, 2, 3];
b = b.map(function (value, i) {
    return value * 2 // [2,4,6]
})

Pièges possibles : il existe des séparateurs par virgules entre les données traitées par map

Raison : après le parcours de la carte, il s'agit toujours d'un tableau et les éléments du tableau séparés par virgules. Lors de l'insertion dans le DOM, seul toString est appelé. Les séparateurs par virgules entre les éléments du tableau sont également introduits. Après avoir parcouru la carte, les concaténer directement en chaînes éliminera ce problème. it : map est suivi de la méthode .join('')

reduce (cumulative)

reduce() reçoit une fonction comme accumulateur, chaque valeur du tableau La réduction commence (de gauche à droite) et finit par calculer une valeur.

reduce() peut être utilisée comme fonction d'ordre supérieur pour la fonction compose.

Remarque : réduire() n'exécutera pas la fonction de rappel pour un tableau vide.

Calculer les éléments précédents et suivants

let a = [1, 2, 3];
a = a.reduce(function (prev, next) {
    return prev + next // 1+2+3 = 6
})

filtre (filtre)

Filtrer les valeurs qui ne remplissent pas les conditions et renvoie un nouveau tableau

let a = [1, 2, 3];
a = a.filter(function (value, i) {
    return value > 2 
})
console.log(a) // 3

chaque (tous)

Déterminez si chaque élément remplit les conditions, si c'est le cas, retournez vrai, sinon faux

let a = [1, 2, 3];
a = a.every(function (value, i) {
    return value > 2 
})
console.log(a) // false

certains (arbitraire)

Déterminez si l'un de chaque élément remplit la condition, si c'est le cas, retournez vrai, sinon faux

let a = [1, 2, 3];
a = a.every(function (value, i) {
    return value > 2 
})
console.log(a) // true

Tutoriel recommandé : "

Tutoriel 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!