总结的js循环遍历

1.for

var arr = ['香蕉', '苹果', '橘子']

for (var i = 0; i < arr.length; i++) {
    console.log(i); //下标 0,1,2
    console.log(arr[i]); //香蕉,苹果,橘子
}

输出结果：

2.for-in

var arr = ['香蕉', '苹果', '橘子']
for (var i in arr) {
    console.log(i); //0,1,2
    console.log(arr[i]); //香蕉,苹果,橘子
}

输出结果：

for-in还可以用来遍历对象

var arr = {
    name: "姓名",
    sex: "男",
}
for (var i in arr) {
    console.log(i); //键名:name,sex
    console.log(arr[i]); //键值:姓名,男
}

输出结果：

3.for-of

var arr = ['香蕉', '苹果', '橘子']

for (var i of arr) {
    console.log(i);
}

输出结果：

4.forEach()

var arr = ['香蕉', '苹果', '橘子']

arr.forEach((item, index, arr) => { //item:必传 index:非必传 arr:非必传
    console.log(item); //香蕉,苹果,橘子
    console.log(index); //0,1,2
    console.log(arr); //数组
})

注意：forEach方法不会改变原数组

输出结果：

5.map()

var arr = ['香蕉', '苹果', '橘子']

arr.map((item, index, arr) => { //item:必传 index:非必传 arr:非必传
    console.log(item); //香蕉,苹果,橘子
    console.log(index); //0,1,2
    console.log(arr); //数组
})

注意：map方法会返回一个新数组

输出结果：

6.filter()

filter用于对数组进行过滤。
创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

var arr = ['香蕉', '苹果', '橘子']

var res = arr.filter(item => {
    return item != "香蕉";
});
console.log(res);

注意： filter() 不会对空数组进行检测。
注意： filter() 不会改变原始数组。

输出结果：