for...of与for...in的区别

2021-05-21 16:02:10 阅读：124 来源： 互联网

标签：... console log 迭代区别 obj iterable

for...in

for...in语句以任意顺序遍历一个对象的除Symbol以外的可枚举属性

var obj = {a:1, b:2, c:3};

for (var prop in obj) {
  console.log("obj." + prop + " = " + obj[prop]);
}

// Output:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

for...of

for...of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句
注意：循环迭代并记录iterable作为可迭代对象定义的迭代值，这些是数组元素 3, 5, 7，而不是任何对象的属性

const array1 = ['a', 'b', 'c'];

for (const element of array1) {
  console.log(element);
}

不同点

for of 只遍历iterable定义的迭代值，并且不能遍历对象，
for in 遍历迭代对象可枚举的值，所以包括继承，还有定义的属性

Object.prototype.objCustom = function () {};
      Array.prototype.arrCustom = function () {};

      let iterable = [3, 5, 7];
      iterable.foo = "hello";
      for (let key in iterable) {
        console.log(key, "in");//0, 1, 2, "foo", "arrCustom", "objCustom"
      }
      for (let key of iterable) {
        console.log(key, "of");//3, 5, 7
      }

标签：...,console,log,迭代,区别,obj,iterable
来源： https://www.cnblogs.com/heihei-haha/p/14794167.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

for...of与for...in的区别

for...in

for...of

不同点