在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. Python中str类型的字符串写入二进制文件时报TypeError错的处理方式

    在用二进制模式打开文件情况下,写入一个str对象时报错:TypeError: a bytes-like object is required, not 'str' 出现该问题是因为Python严格区分 ...

  2. 第十五章、Model/View架构中Item Views部件的父类

    老猿Python博文目录 老猿Python博客地址 引言:本章早就写好了,其简版<第15.18节 PyQt(Python+Qt)入门学习:Model/View架构中视图Item Views父类详 ...

  3. PyQt(Python+Qt)学习随笔:QAbstractItemView的textElideMode属性

    老猿Python博文目录 老猿Python博客地址 一.概述 textElideMode属性用于控制省略文本中省略号"-"的位置,当项的内容过多视图无法显示完整时会显示部分内容,并 ...

  4. PyQt(Python+Qt)学习随笔:Qt Designer中QAbstractButton派生按钮部件的shortcut 属性

    shortcut 属性保存与按钮关联的快捷键.可以使用shortcut()和setShortcut(QKeySequence)访问和设置该属性. 关于这个属性官网介绍的不多,经老猿实际验证,它与tex ...

  5. PyQt(Python+Qt)学习随笔:gridLayout的layoutRowMinimumHeight和layoutColumnMinimumWidth属性

    Qt Designer中网格布局(gridLayout)中,layoutRowMinimumHeight和layoutColumnMinimumWidth两个属性分别设置网格布局中各行的最小高度和各列 ...

  6. [BJDCTF2020]ZJCTF,不过如此 php伪协议, preg_replace() 函数/e模式

    转自https://www.cnblogs.com/gaonuoqi/p/12499623.html 题目给了源码 <?php error_reporting(0); $text = $_GET ...

  7. pytorch实战(一)hw1——李宏毅老师作业1

    任务描述:利用前9小时数据,预测第10小时的pm2.5的数值,回归任务 kaggle地址:https://www.kaggle.com/c/ml2020spring-hw1 训练集为: 12个月*20 ...

  8. js onreadystatechange 和 onload的区别

    IE的script 元素只支持onreadystatechange事件,不支持onload事件. FF的script 元素不支持onreadystatechange事件,只支持onload事件. 如果 ...

  9. uniapp发布到微信小程序整改摘要

    uniapp作为跨端的利器,可同时发布到安卓.ios.微信小程序.支付宝小程序.百度小程序.头条小程序.QQ小程序等8个平台. 如果是轻量级的应用,不涉及太多功能的话,或许可以直接打包移植,但涉及前后 ...

  10. 哔哩哔哩批量采集器(支持windows和mac)

    链接:https://pan.baidu.com/s/1jW2ea0Cl1xL5xN9DuB8Fcw  密码:klyw