js数组遍历的方法的一些细节

一、for，for/in，for/of遍历数组。

for常用循环，没有什么好说的。

for/in循环：

let Arr1 = [undefined,"undefined",,null,"null",'',"01","02",false];
Arr1.text="ttttt";
for (let i in Arr1) {
    console.log(i,Arr1[i]);
}

结果for/in循环会将数组的text就是非数值下标的值也会循环。并且数组中的“undefined”文本数组元素后的空白数组元素没有循环和打印值。

for/of循环：

let Arr1 = [undefined,"undefined",,null,"null",'',"01","02",false];
let i = 0;
Arr1.text="ttttt";
for (let v of Arr1) {
    console.log(i,v);
    i++
}

结果for/of循环打印了数组的第三个空白元素，值为undefined。没有打印text下标元素。

二、数组自带的一些具有遍历属性的方法find、filter、forEach、map等。

其中forEach没有返回值，find、filter、map具有返回值。

forEach循环与for基本相同，但是forEach循环不能跳出循环，会将数组都循环完才会停止。而for循环可以使用break停止跳出循环。

find方法:

find方法可以使用return停止循环，但是要return出undefined、null、''、空白数组元素、false是不会停止循环。

例如return到空白数组元素时：

let Arr1 = [undefined,"undefined",,null,"null",'',1,2,false,3];
let di = '无';
di = Arr1.find((v,i)=>{
    console.log(i,v);
    if (i == 2) {
        return v;
    }
})
console.log("di值:",di);

结果：

循环完了整个数组，并且di的值为undefined。

当条件改为i==6时，结果：

 循环到下标为6时就停止循环了。

forEach方法：

let Arr1 = [undefined,"undefined",,null,"null",'',1,2,false,3];
let di = '无';
di = Arr1.forEach((v,i)=>{
    console.log(i,v);
    if (i == 1) {
        return "有值";
    }
})
console.log("di值:",di);

 结果：return没有停止循环，并且不管return出什么值，最后接收的值都为undefined。

 filter方法：

let Arr1 = [undefined,"undefined",,null,"null",'',1,2,false,3];
let di = '无';
di = Arr1.filter((v,i)=>{
    console.log(i,v);
    if (i < 7) {
        return v;
    }
})
console.log("di值:",di);

结果：return也没有停止循环，并且return出相应数组元素的值，过滤掉了其中的加值，返回一个过滤后的新数组。

 数组过滤假值的其他方法

map方法：

let Arr1 = [undefined,"undefined",,null,"null",'',1,2,false,3];
let di = '无';
di = Arr1.map((v,i)=>{
    console.log(i,v);
    if (i < 7) {
        return v;
    }
})
console.log("di值:",di);

结果：return没有停止跳出循环，并且return出相应数组元素的值给了新生成的数组，新生成的数组长度与原数组长度一样，剩余数组元素的值为undefined。