在for of循环出现之前,for循环适合遍历普通的数组,for in循环比较适合遍历键值对,遍历数组对象的foreach方法,但是这些遍历

都有一定的局限性,所以在ES6之后引入了统一的遍历方式 for of循环 举例下图所示:

但是此时如果遍历对象的话 会报错 obj is iterable 对象不可迭代 这是什么原因呢,如下图所示:

js中能够表示有结构的数据类型越来越多,为了给各种各样的数据结构提供统一遍历方式,官方提供了一个Iterable的接口 可迭代的

(符合相同的规格标准),实现Iterable 接口就是 for of的前提,也就是说原型链中必须要挂载一个Iterable方法,如下图原型所示:

那这个方法到底是干什么的呢,从下图上不难看出 Iterable底层维护了一个next方法的对象 value值为遍历的下一个元素done属性表示

是否遍历完

在上文中提到 之所以能够使用for of循环遍历 是因为Iterable的接口(符合相同的规格标准),也就是说如果对象符合了这个规格标准,

也可以使用for of循环,我们可以尝试着挂载一个Symbol.iterator方法 然后在方法中返回一个迭代器对象

我们来梳理下这几个对象之间的关系 以及它们的作用
1.最外层的obj对象 实现了可迭代接口 英文名 Iterable
作用:返回一个迭代器的Symbol.iterator方法,
2.Symbol.iterator方法 return的这个对象 实现了迭代器接口 英文名 Iterator
作用:内部必须要有一个内部迭代的next方法,
3.next方法中 return返回的对象 实现了迭代结果接口 英文名 IterationResult
作用:value属性 done的布尔值 表示迭代的值和迭代是否结束

ES6 for of循环, 可迭代接口,实现可迭代接口的更多相关文章

  1. Atitit  循环(loop), 递归(recursion), 遍历(traversal), 迭代(iterate).

    Atitit  循环(loop), 递归(recursion), 遍历(traversal), 迭代(iterate). 1.1. 循环算是最基础的概念, 凡是重复执行一段代码, 都可以称之为循环. ...

  2. 循环(loop), 递归(recursion), 遍历(traversal), 迭代(iterate)的区别

    表示“重复”这个含义的词有很多, 比如循环(loop), 递归(recursion), 遍历(traversal), 迭代(iterate). 循环算是最基础的概念, 凡是重复执行一段代码, 都可以称 ...

  3. python_如何在一个for循环中迭代多个可迭代对象?

    案例: 某班学生期末考试成绩,语文.数学.英语分别存储在3个列表中,同时迭代三个列表.,计算每个学生的总分(并行) 某年级有4个班,某次英语成绩分别记录在4个列表中,依次迭代每个列表,统计全年级高于9 ...

  4. 003_循环(loop), 递归(recursion), 遍历(traversal), 迭代(iterate)的区别

    表示“重复”这个含义的词有很多, 比如循环(loop), 递归(recursion), 遍历(traversal), 迭代(iterate). 循环算是最基础的概念, 凡是重复执行一段代码, 都可以称 ...

  5. Python-如何在一个for循环中迭代多个可迭代对象?

    案例: 某班学生期末考试成绩,语文.数学.英语分别存储在3个列表中,同时迭代三个列表.,计算每个学生的总分(并行) 某年级有4个班,某次英语成绩分别记录在4个列表中,依次迭代每个列表,统计全年级高于9 ...

  6. 如何把 Callback 接口包装成 Promise 接口

    最近一段时间一直在看Node.js,在开发过程中经常要调用一些异步接口,通常在接口的最后一个参数会传入一个回调函数,可以用来处理异常,非异常情况.大致模式如下: var fs = require(“f ...

  7. java基础2.-------interface接口类,实现接口

    1.为什么使用接口,是把功能方法都写在一个类中,在其他需要调用的时候,通过implements实现该接口 2.接口可以继承多个父类接口,在实现接口的时候,实现类实现所有方法 3.在接口类写方法时,自动 ...

  8. 【linux草鞋应用编程系列】_1_ 开篇_系统调用IO接口与标准IO接口

    最近学习linux系统下的应用编程,参考书籍是那本称为神书的<Unix环境高级编程>,个人感觉神书不是写给草鞋看的,而是 写给大神看的,如果没有一定的基础那么看这本书可能会感到有些头重脚轻 ...

  9. 转】C#接口-显式接口和隐式接口的实现

    [转]C#接口-显式接口和隐式接口的实现 C#中对于接口的实现方式有隐式接口和显式接口两种: 类和接口都能调用到,事实上这就是“隐式接口实现”. 那么“显示接口实现”是神马模样呢? interface ...

随机推荐

  1. [RoarCTF2019]黄金6年

    嘶吼CTF的杂项题 这道题目比较简单 下载之后是一个mp4文件,黄金六年,害,亲爱的热爱的里面的梗 使用010 Editor打开视频文件,发现最下面有base64编码 UmFyIRoHAQAzkrXl ...

  2. 函数与函数式编程(生成器 && 列表解析 && map函数 && filter函数)-(四)

    在学习python的过程中,无意中看到了函数式编程.在了解的过程中,明白了函数与函数式的区别,函数式编程的几种方式. 函数定义:函数是逻辑结构化和过程化的一种编程方法. 过程定义:过程就是简单特殊没有 ...

  3. Hadoop 中HDFS、MapReduce体系结构

    在网络环境方面,作为分布式系统,Hadoop基于TCP/IP进行节点间的通信和传输. 在数据传输方面,广泛应用HTTP实现. 在监控.通知方面,Hadoop等分布式大数据软件则广泛使用异步消息队列等机 ...

  4. flask对数据库的外键 主键

    近期一直在学flask框架,后悔当初没有好好学习数据库.一个外键的知识,真的是太....蓝瘦香菇 创建数据库 class Users(db.Model): __tablename__ = 'users ...

  5. Day4 Scrum 冲刺博客

    线上会议: 昨天已完成的工作与今天计划完成的工作及工作中遇到的困难: 成员姓名 昨天完成工作 今天计划完成的工作 工作中遇到的困难 纪昂学 创建一个Tetromino类来作为7个经典形状的父类 绘制下 ...

  6. ES6 代码转成 ES5 代码的实现思路是什么(来自github每日一题)

    将代码字符串解析成抽象语法树,即所谓的 AST 对 AST 进行处理,在这个阶段可以对 ES6 代码进行相应转换,即转成 ES5 代码 根据处理后的 AST 再生成代码字符串 每日一题https:// ...

  7. 【题解】CIRU - The area of the union of circles [SP8073] \ 圆的面积并 [Bzoj2178]

    [题解]CIRU - The area of the union of circles [SP8073] \ 圆的面积并 [Bzoj2178] 传送门: \(\text{CIRU - The area ...

  8. NOI Online #3 提高组 游记

    考的好就来写游记吧 2020.5.24 星期日 上一天晚上为了班里事物做 PPT 肝到 11:30,这比赛就打打玩玩.第二天醒来有点昏昏沉沉的感觉. 打开题面,一看 T1,好像是个性质极其简单的前缀和 ...

  9. git clone GitLab 工程报错Repository not found

    有时使用git拉取gitlab上的项目时会出现如下的错误信息:Repository not found remote: Repository not found.fatal: repository ' ...

  10. VS2015配置海康威视工业相机SDK二次开发

    1.概述:工业相机SDK是用于控制相机的一个独立组件,支持获取实时图像数据.配置参数.对图像进行后续处理等功能.工业相机SDK兼容GigE Vision协议.USB3 Vision协议.Camera ...