一、比较
1.for原始写法
const arr = ['a', 'b', 'c', 'd'];
for (let i = 0; i < arr.length; i++) {
console.log(`${i}:${arr[i]}`);
}
//0:a 1:b 2:c 3:d
特点:写法较繁琐
2.forEach
arr.forEach(function (item, index, self) {
console.log(`${index}:${item}`);
})
//0:a 1:b 2:c 3:d
特点:无法中途跳出循环,break或return都不行
3.for...in
for (let key in arr) {
console.log(key);
}
//0 1 2 3
特点:遍历的是数组的键名,且会遍历原型链上的键,有时候遍历顺序不可确定,主要是为遍历对象设计
4.for...of
for (let item of arr) {
console.log(item);
}
//a b c d
特点:写法简洁,无for...in遍历的缺点,可以中途退出(return/break/continue)
二、应用
1.边遍历边删除
for (let i = 0; i < arr.length; i++) {
let item = arr[i];
if (item == 'b') {
arr.splice(i, 1);
}
console.log(`${i}: ${item}`);
}
// 0:a 1:b 2:d
删除时需改变下标,否则会漏掉一个,因为一旦执行splice方法,则会实时改变数组本身,所以需手动移动下标(i--),只有原始for循环可实现,for...in、forEach等都不能手动改变下标。
for (let i = 0; i < arr.length; i++) {
let item = arr[i];
if (item == 'b') {
arr.splice(i, 1);
i--;
}
console.log(`${i}: ${item}`);
}
// 0:a 0:b 1:c 2:d
参考:《阮一峰 es6入门》
网友评论