js for in 和for of的区别

const myArr = [
  {
      name:"ss",
      age:11,
  },
  {
      name:"aa",
      age:12,
  },
  {
      name:"dd",
      age:15,
  }
]
const json = {
  name:'sss',
  age:18,
  grade:33
}

for in

      //for in 可获得数组下标
      for (const key in myArr) {
          console.log(key);
          console.log(myArr[key]);
      }
      for (const key in json) {
          console.log(key);
      }
      

for of

      // for ... of循环是ES6引入的新的语法
      for (const key of myArr) {
          console.log(key);
      }
      //此处会报错：TypeError: json is not iterable
      //说明for of不能遍历对象
      for (const iterator of json) {
          console.log(iterator);
      }

为什么for of遍历对象元素报错 TypeError: json is not iterable

• for of为es6为iterator类型数据出的遍历方法
• iterator包括：Array,Map,Set类型，以下为我对这三种数据类型的理解

1. Array唯一识别为下标index（所以 for in的in可以理解为index）

2. Map粗浅理解为平时的{}，键值对

3. Set为去重数组，数组中没有相同的元素

    // 遍历Array可以采用下标循环，遍历Map和Set就无法使用下标。
    // 为了统一集合类型，ES6标准引入了新的iterable类型，Array、Map和Set都属于iterable类型。
    // 具有iterable类型的集合可以通过新的for ... of循环来遍历。
   
    //Object.prototype.hasOwnProperty.call()
    //https://blog.csdn.net/sd19871122/article/details/103866120
    //JavaScript中Object对象原型上的hasOwnProperty()
    //用来判断一个属性是定义在对象本身而不是继承自原型链
    //   for (const key in object) {
    //       if (Object.hasOwnProperty.call(object, key)) {
    //           const element = object[key];                  
    //       }
    //   }