zoukankan      html  css  js  c++  java
  • es6 for of 循环

    es6 新增了 for of 循环,只要继承了Iterator 接口的数据集合都可以使用 for of 去循环

      for of 循环,统一数据集合的循环方法,解决了forEach循环的不能使用break contain ,遍历时,循环能够按某种方式排序

      js 集合中能默认使用for of 有,数组,类数组,字符串,map,set

    // for of 数组
    for (let item of [1,2,3,4,5]) {
        console.log(item); //1,2,3,4,5
    }
    //for of set
    for (let item of new Set().add('2').add('3').add('4')) {
        console.log(item); //2,3,4
    }
    //for of map
    for (let item of new Map().set({a:'1'},'2').set({a:'2'},'3').set({a:'2'},'4')) {
        console.log(item); //[{0:{a:'1'},1:undefined},2],[{0:{a:'2'},1:undefined},3][{0:{a:'2'},1:undefined},4]
    }
    // for of 字符串
    //使用generator 函数 类数组实现iterator接口
    let lszarray3 = {
        0: '1234',
        1: '321',
        2: '12311',
        length: 3,
    }
    lszarray3[Symbol.iterator] = function* () {
        let index = 0;
        let leng = this.length
        let _self = this
        for(;parseInt(index) < leng;index++) {
            yield [index,_self[index]]
        }
    }
    for(let item of lszarray3) {
        console.log(item) //{0:1234} {1:321} {2 12311}
    }
    //使用generator 函数 对象实现iterator接口
    //第一种方法
    let lszarray4 = {
        a: '12345',
        b: '321',
        c: '12311',
    }
    lszarray4[Symbol.iterator] = function* () {
        let keys = Object.keys(this)
        for(key of keys) {
            yield [key,this[key]]
        }
    }
    for(let item of lszarray4) {
        console.log(item) //{a:1234} {b:321} {c 12311}
    }
    
    
    
    for(let item of 'aaabbb') {
        console.log(item) //a a a b b b
    }
    //类数组 没找到列子,不是所有的类数组都能使用for of
     let lszarray = {
         0: '123',
         1: '321',
         2: '12311',
         length: 3
     }
     /* for(let item of lszarray) {
       lszarray is not iterable
     } */
    // 要使类数组能使用 for of 则必须给类添加 Iterator 接口
    // iterator 接口部署在 Symbol.iterator 属性上
    lszarray[Symbol.iterator] = function () {
        let index = 0;
        let self = this
        return {
            next: function () {
                if(index < self.length) {
                    return {
                        value: self[index++], done: false
                    }
                }   else {
                    return {
                        value: 1, done: true
                    }
                }
            }
        }
    }
    
    for(let item of lszarray) {
        console.log(item) // 123 321 12311
    }

      对象默认使不能够使用for of 的,如果想要对象能使用 for of  则必须为对象添加Iterator接口,添加接口的方式和类数组差不多

    / 对象使用 for of 循环
    // 新建一个对象objs
    let objs = {
        a: 'cz',
        b: 'czzzz',
        c: '1233',
        vc: '2222'
    }
    //为objs 添加 Iterator 
    //在对象的Symbol.iterator 上添加方法
    objs[Symbol.iterator] = function () {
        let keys = Object.keys(this);
        let _self = this;
        let index = 0
        return {
            next () {
                if(index < keys.length) {
                    return {
                        value: _self[keys[index++]], done: false
                    }
                }   else {
                    return {
                        value: 1, done: true
                    }
                }
            }
        }
    }
    for(let item of objs) {
        console.log(item) //cz czzzz 1233 2222
    }

      对于类数组来说,还有更简单的实现Iteration 的方式,直接引用数组上的[Symbol.iterator]方法

     1 //类数组 直接引用数组上的Symbol.iterator
     2 let lszarray2 = {
     3     0: '123',
     4     1: '321',
     5     2: '12311',
     6     length: 3,
     7     [Symbol.iterator]: [][Symbol.iterator]
     8 }
     9 for(let item of lszarray2) {
    10     console.log(item) //123 321 12311 
    11 }

      对于Iteraot 接口,还可以使用generator 函数去实现 

  • 相关阅读:
    321list,元组,range**数字是不可迭代的!
    320作业
    320基础数据类型初始
    319作业
    316作业
    319 Python基础之格式化输出、逻辑运算符、编码、in not in、while else、
    windows查看端口占用指令
    2016年学习计划
    刷算法的时候有没有必要自写测试用例?
    我们为什么不能只用O记号来谈论算法?
  • 原文地址:https://www.cnblogs.com/czkolve/p/10645476.html
Copyright © 2011-2022 走看看