了解for...in和for...of

for...in:循环遍历的值都是数据结构的键值,它可以循环数组也能循环对象,它遍历数元素的时候,还会遍历其他新增的属性.

  <script>
        const a ={
            name:'小民',
            age:'18',
        } //创建对象
            for(let i in a){ //使用for...in 来遍历对象
               console.log(i);// name age
            }

    </script>

for...in遍历出了对象a的属性

    <script>
        const a ={
            name:'小民',
            age:'18',
        } //创建对象
            for(let i in a){ //使用for...in 来遍历对象
              console.log(a[i]);// 小民  18
            }

    </script>

console.log(a[i])可以获取对象内的值

for...of:可以遍历数组，但是在正常情况下它是没有办法遍历可迭代对象的

var  arr=[1,2,3,4,5,6]
for(let i of arr){
    console.log(i);
}//1,2,3,4,5,6

那for...of怎么遍历可迭代对象呢？我们就要用到iterator。

iterator遍历器是一种接口，为各种不同的数据结构提供统一的访问机制。也就是说只要拥有了 Iterator 接口就可以完成统一访问遍历操作。

作用

1. 为不同的数据结构提供统一的访问机制；

2. 使得数据结构的成员能够按照某种次序排序；

3. 为 ES6 for…of 调用。

   // 对象
   function Person(name,age,sex){
       this.name=name
       this.age=age
       this.sex=sex
   }
   Person.prototype.hight=188
    
   p[Symbol.iterator]=function(){
       var keys=Object.keys(this)
       var index=0
       return {
           next(){
               if(index<keys.length){
                   return{value:p[keys[index++]],done:false}
    
               }else{
                   return{value :undefined,done:true}
               }
           }
       }
   }
   var p=new Person("张三",18,"男")
   for(let i  of p){
       console.log(i);
   }
   //张三  18  男