区分 for...in 和 for...of

  我们都知道在 JavaScript 中 for...in 和 for...of 都可以迭代一个数组,但他们之间也有着很大的区别:

 

区别一:用于迭代器的返回值不同

  for...in 和 for...of 最明显的区别莫过于他们用于迭代器的返回值不同,for...in 迭代的是对象的键,而 for...of 迭代的是对象的值。我们可以通过下面的例子对二者进行区分:

const array = [3,4,5]

for (let i in array) {
    console.log(i)    //0,1,2
}

for (let i of array) {
    console.log(i)    //3,4,5
}

  

区别二:功能权限不同

  另一个区别在于,for...in 可以操作任何对象,提供了查看对象属性的一种方法。但是 for...of 关注迭代对象的值,内置对象Map和Set已经实现了Symbol.iterator 方法,让我们可以访问它们的值:

const fruits = new Set(['apple','pear','mango'])
fruits['peach'] = 'Princess Peach! Make a wish!'

for(let fruit in fruits) {
    console.log(fruit)  //peach
}

for (let fruit of fruits) {
    console.log(fruit) //apple pear mango
}

  但是这样的特性仅仅在 ES6 及以上才生效。

 

 

 

posted @ 2019-11-04 23:30  刘彤彤  阅读(343)  评论(0编辑  收藏  举报