Republié de : Cinq méthodes de parcours de tableau JavaScript
Cet article présente principalement cinq méthodes de parcours de tableau JavaScript pour vous aider à mieux comprendre et apprendre à utiliser JavaScript. Les amis intéressés peuvent en apprendre davantage à ce sujet.
Lors du processus d'écriture de code en JavaScript, vous pouvez utiliser plusieurs méthodes pour parcourir le tableau, notamment des méthodes telles que la boucle for, la boucle forEach, la boucle map, la boucle forIn et la boucle forOf.
1. Boucle for : basique et simple
Il s'agit de la méthode la plus basique et la plus couramment utilisée pour parcourir un tableau ; divers langages de développement prennent généralement en charge cette méthode.
let arr = ['a','b','c','d','e'];
for (let i = 0, len = arr.length; i < len; i++) {
console.log(i); // 0 1 2 3 4
console.log(arr[i]); //a b c d e
}
Deux, méthode forEach() : utilisez la fonction de rappel
forEach() C'est une méthode de l'objet Array, elle accepte une fonction de rappel comme argument.
Il y a trois paramètres dans la fonction de rappel :
- 1er : élément de tableau (obligatoire)
- 2ème : valeur d'index de l'élément de tableau (optionnel)
- 3ème : le tableau lui-même (optionnel)
let arr = ['a','b','c','d','e'];
arr.forEach((item,index,arr)=> {
console.log(item); // a b c d e
console.log(index); // 0 1 2 3 4
console.log(arr); // ['a','b','c','d','e']
})
3. méthode map() : utilisez la fonction de rappel
Elle s'utilise de la même manière que la méthode forEach().
var arr = [
{name:'a',age:'18'},
{name:'b',age:'19'},
{name:'c',age:'20'}
];
arr.map(function(item,index) {
if(item.name == 'b') {
console.log(index) // 1
}
})
Quatre, boucle for..in : traverse les objets et les tableaux
La boucle for...in peut être utilisée pour boucler sur des objets et des tableaux.
Recommandé pour les objets en boucle, et peut également être utilisé pour traverser json.
let obj = {
name: '王大锤',
age: '18',
weight: '70kg'
}
for(var key in obj) {
console.log(key); // name age weight
console.log(obj[key]); // 王大锤 18 70kg
}
----------------------------
let arr = ['a','b','c','d','e'];
for(var key in arr) {
console.log(key); // 0 1 2 3 4 返回数组索引
console.log(arr[key]) // a b c d e
}
Cinq, boucle for...of : traverse les objets et les tableaux
Tableaux et objets bouclables, recommandés pour parcourir les tableaux.
for...of fournit trois nouvelles méthodes :
- key() est un parcours de noms de clés ;
- value() est un parcours de valeurs clés ;
- entrées() est un parcours de paires clé-valeur ;
let arr = ['科大讯飞', '政法BG', '前端开发'];
for (let item of arr) {
console.log(item); // 科大讯飞 政法BG 前端开发
}
// 输出数组索引
for (let item of arr.keys()) {
console.log(item); // 0 1 2
}
// 输出内容和索引
for (let [item, val] of arr.entries()) {
console.log(item + ':' + val); // 0:科大讯飞 1:政法BG 2:前端开发
}
6. Supplément
6.1, casser et continuer les problèmes
Dans les fonctions forEach, map, filter, reduce, every, some, les mots-clés break et continue ne prendront pas effet, car ils sont dans la fonction, mais la fonction résout le problème du piège de fermeture.
Pour utiliser break et continue, vous pouvez utiliser for, for...in, for...of, while.
6.2, tableaux et objets
用于遍历数组元素使用:for(),forEach(),map(),for...of 。
用于循环对象属性使用:for...in。