JS中的forEach,for in,for of和for的遍历优缺点及区别

Posted 2023-04-23

参考技术A 优点: 遍历的时候更加简洁,效率和for循环相同,不用关心集合下标的问题,减少出错的效率
缺点: 不能同时遍历多个集合，在遍历的时候无法修改和删除集合数据，方法不能使用break，continue语句跳出循环，或者使用return从函数体返回,对于空数组不会执行回调函数

forEach不可遍历对象,这也是和for in的区别

优点: 可以遍历数组的键名,遍历对象简洁方便
缺点: 某些情况下,会出现随机顺序的遍历,因为里面的值是string类型,所以增加了转换过程,因此开销比较大

优点: 避免了for in的所有缺点,可以使用break，continue和return，不仅支持数组的遍历,还可以遍历类似数组的对象,支持字符串的遍历,最直接的遍历数组的语法,支持map和set对象遍历
缺点: 不适用于处理原有的原生对象

优点: 程序简洁，结构清晰，循环初始化，循环变量化，循环体和循环条件位置突出
缺点: 结构比while循环复杂，容易出编码错误

Js中for in 和for of的区别

参考技术A 对数组的遍历大家最常用的就是for循环，ES5的话也可以使用forEach，ES5具有遍历数组功能的还有map、filter、some、every、reduce、reduceRight等，只不过他们的返回结果不一样。但是使用foreach遍历数组的话，使用break不能中断循环，使用return也不能返回到外层函数。

那么接下来我们一起看一下for in 和for of 的区别吧。

##### for in

看一个简单的例子

```

//for in 应用于数组

Array.prototype.sayHello = function()

    console.log("Hello")



Array.prototype.str = 'world';

var myArray = [1,2,10,30,100];

myArray.name='数组';

for(let index in myArray)

    console.log(index);



//输出结果如下

0,1,2,3,4,name,str,sayHello

//for in  应用于对象中

Object.prototype.sayHello = function()

    console.log('Hello');



Obeject.prototype.str = 'World';

var myObject = name:'zhangsan',age:100;

for(let index in myObject)

    console.log(index);



//输出结果

name,age,str,sayHello

//首先输出的是对象的属性名，再是对象原型中的属性和方法，

//如果不想让其输出原型中的属性和方法，可以使用hasOwnProperty方法进行过滤

for(let index in myObject)

    if(myObject.hasOwnProperty(index))

        console.log(index)

   



//输出结果为

name,age

//你也可以用Object.keys()方法获取所有的自身可枚举属性组成的数组。

Object.keys(myObject)

```

可以看出for in 应用于数组循环返回的是数组的下标和数组的属性和原型上的方法和属性，而for in应用于对象循环返回的是对象的属性名和原型中的方法和属性。

使用for in 也可以遍历数组，但是会存在以下问题：

1.index索引为字符串型数字，不能直接进行几何运算

2.遍历顺序有可能不是按照实际数组的内部顺序

3.使用for in会遍历数组所有的可枚举属性，包括原型。例如上栗的原型方法method和name属性

##### for of

```

Object.prototype.sayHello = function()

    console.log('Hello');



var myObject =

    name:'zhangsan',

    age:10



for(let key of myObject)

    consoloe.log(key);



//输出结果

//typeError

Array.prototype.sayHello = function()

    console.log("Hello");



var myArray = [1,200,3,400,100];

for(let key of myArray)

    console.log(key);



//输出结果

1,200,3,400,100

```

for in遍历的是数组的索引（即键名），而for of遍历的是数组元素值。

所以for in更适合遍历对象，不要使用for in遍历数组。