for of

for…of语句在可迭代对象上执行遍历，在 每次遍历中，将不同属性的值（ Map是键值 对）分配给变量。

可迭代对象是具有Iterator接口，即含有 [SymboLiterator]属性的数据类型:包括 Array, Map, Set, String, arguments, TypedArray(二进制相关数组)等。

  

   

    

     

    
    

     

      //遍历array。array的黑犬认[SymboLiterator]是array的values。方法。返回array每项的值的迭代器。
     
    
   

    

     

    
    

     

      let arr = [1,2,3];
     
    
   

    

     

    
    

     

      for (let val of arr) {
     
    
   

    

     

    
    

     
    console.log(val);
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      //123
     
    
   

    

     

    
    

     

      //遍历arguments
     
    
   

    

     

    
    

     

      function sum() {
     
    
   

    

     

    
    

     
    let sum = 0
     
    
   

    

     

    
    

     
    for(let num of arguments){
     
    
   

    

     

    
    

     

              sum += num
     
    
   

    

     

    
    

     

          }
     
    
   

    

     

    
    

     
    console.log(sum); //15
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      sum(1,2,3,4,5)
     
    
   

    

     

    
    

     

      //遍历Map, Map的默认[Symbol.iterator]是Map的entries()方法。返回Map键值对迭代器。
     
    
   

    

     

    
    

     

      var map = new Map()
     
    
   

    

     

    
    

     

      map.set('a', 'A')
     
    
   

    

     

    
    

     

      map.set('b', 'B')
     
    
   

    

     

    
    

     

      map.set('c', 'C')
     
    
   

    

     

    
    

     

      for(var n of map){
     
    
   

    

     

    
    

     
    console.log(n)
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      // ['a','A']
     
    
   

    

     

    
    

     

      // ['b','B']
     
    
   

    

     

    
    

     

      // ['c','C']
     
    
   

    

     

    
    

     

      for (let [key, val] of map) {
     
    
   

    

     

    
    

     
    console.log(val);
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      // 'A''B'C'
     
    
   

    

     

    
    

     

      //遍历 Set。Set的黑犬认[Symbol.iterator]是Set的values。方法。返回Set值迭代器。
     
    
   

    

     

    
    

     

      let set = new Set([1,1,2,2,3,3]);
     
    
   

    

     

    
    

     

      for (let val of set) {
     
    
   

    

     

    
    

     
 console.log(val);
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      //1 2 3
     
    
   

    

     

    
    

     

      //遍历由生成器创建的迭代器(iterator)
     
    
   

    

     

    
    

     

      function *gen(){
     
    
   

    

     

    
    

     
    yield 1;
     
    
   

    

     

    
    

     
    yield 2;
     
    
   

    

     

    
    

     
    yield 3;
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      let iterl = gen();
     
    
   

    

     

    
    

     

      for (let letter of iterl) {
     
    
   

    

     

    
    

     
    console.log(letter);
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      //1 2 3
     
    
   

    

     

    
    

     

      let arr =['a','b','c'];
     
    
   

    

     

    
    

     

      let iter2 = arr[Symbol.iterator]();
     
    
   

    

     

    
    

     

      for (let letter of iter2) {
     
    
   

    

     

    
    

     
    console.log(letter);
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      // a b c
     
    
  
 

 使用 break、continues return 和 throw 终止循环执行：

  

   

    

     

    
    

     

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

    

     

    
    

     

      for (const value of iterable) {
     
    
   

    

     

    
    

     
    console.log(value);
     
    
   

    

     

    
    

     
    break;
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      //a (只有a被打印出来)
     
    
  
 

普通对象非可迭代对象，无法使用for of遍 历 ， 如需使用可添加一个[SymboLiterator]属性，并指向一个迭代器生成函数（生成器，或任何可以返回一个 迭代器的函数）即可。

  

   

    

     

    
    

     

      let obj = {
     
    
   

    

     

    
    

     
    "0": "aa",
     
    
   

    

     

    
    

     
    "2": "cc"
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      obj[ Symbol.iterator ] = function *(){
     
    
   

    

     

    
    

     
    for( let key in this){
     
    
   

    

     

    
    

     
        let val = this[key];
     
    
   

    

     

    
    

     
        yield val;
     
    
   

    

     

    
    

     

          }
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      for( let i of obj){
     
    
   

    

     

    
    

     
    console.log(i)
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      //aa
     
    
   

    

     

    
    

     

      //bb
     
    
   

    

     

    
    

     

      // cc
     
    
   

    

     

    
    

     

      如果是伪数组对象（含索引数属性和length属性）还可直接借用数组的。obj[Symbol.iterator] = [] [Symbol.iterator]
     
    
  
 

或者使用 Object.keys和Object.entries转 化成数组后再用for of

  

   

    

     

    
    

     

      const obj = {
     
    
   

    

     

    
    

     
    a: 1,
     
    
   

    

     

    
    

     
    b: 2,
     
    
   

    

     

    
    

     
    c: 3
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      // Object.keys(obj)输出["a", "b", "c"]
     
    
   

    

     

    
    

     

      for (var key of Object.keys(obj)) {
     
    
   

    

     

    
    

     
    console.log(key + ':'+ obj[key])
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      //a: 1
     
    
   

    

     

    
    

     

      //b:2
     
    
   

    

     

    
    

     

      //c:3
     
    
   

    

     

    
    

     

      // Object.entries(obj)输出[["a", 1],["c",3]]
     
    
   

    

     

    
    

     

      for (let [key, value] of Object.entries(obj)) {
     
    
   

    

     

    
    

     
    console.log(key,value)
     
    
   

    

     

    
    

     

      }
     
    
   

    

     

    
    

     

      //a-1
     
    
   

    

     

    
    

     

      //b-2
     
    
   

    

     

    
    

     

      //c-3
     
    
  
 

for of遍历原理:

  

   

    

     

    
    

     

      //先调用可迭代对象iterable内部的Symbol.iterator方法来获取迭代器iterator。然后循环每执行一次都会调用迭代器的next。方法,并将迭代器返回的结果对象中的value性存储在一个变量中，这样不断循环直到返回
     
    
   

    

     

    
    

     

      对象的done属性的值为true。for of实际遍历的是迭代器。
     
    
   

    

     

    
    

     

      var iterator = iterable[Symbol.iterator]();
     
    
   

    

     

    
    

     

      for(;;){
     
    
   

    

     

    
    

     
    var result = iterator.next();
     
    
   

    

     

    
    

     
    if (result.done) break;
     
    
   

    

     

    
    

     
    var item = result.value;
     
    
   

    

     

    
    

     

          ...
     
    
   

    

     

    
    

     

      }
     
    
  
 

文章来源: root181.blog.csdn.net，作者：前端纸飞机，版权归原作者所有，如需转载，请联系作者。

原文链接：root181.blog.csdn.net/article/details/120147278