一个数据结构只要部署了Symbol.iterator属性就能使用 for...of遍历...运算符 操作

 

Object身上没有Symbol.iterator,当直接使用时会报错

        let obj = {
0: 'a',
1: 'b',
2: 'c',
} console.log([...obj])//报错obj is not iterable
     在没有Symbol.iterator方法下运行
let obj = {
0: 'a',
1: 'b',
2: 'c',
} for(let p of obj){
console.log(p);//TypeError: obj is not iterable
}

  

Array身上天生具备Symbol.iterator

        let arr = [1,2,3,4];

        console.log([...arr]);//(4) [1, 2, 3, 4]
数组,天生具备Symbol.iterator方法所以可以使用

而我们Object需要用到...运算符for of遍历怎么办呢

如果我们要使用它的话,Object身上需要有一个Symbol.iterator属性代码如下:

  let obj = {
0: 'a',
1: 'b',
2: 'c',
length: 3,
[Symbol.iterator]: function () {
// index用来记遍历圈数
let index = 0;
let next = () => {
return {
value: this[index],
done: this.length == ++index
}
}
return {
next
}
}
} // console.log(obj.length)
console.log([...obj]);//(2) ["a", "b"] for(let p of obj){
console.log(p) //"a" "b"
}

  

ES6-Symbol.iterator 迭代器的更多相关文章

  1. Es6 Symbol.iterator

    Symbol.iterator 为每一个对象定义了默认的迭代器.该迭代器可以被 for...of 循环结构使用. --描述 当需要迭代一个对象的时候(比如在 for...of 循环的开始时),它的 @ ...

  2. ES6笔记(6)-- Set、Map结构和Iterator迭代器

    系列文章 -- ES6笔记系列 搞ES6的人也是够无聊,把JS弄得越来越像Java.C++,连Iterator迭代器.Set集合.Map结构都出来了,不知道说什么好... 一.简单使用 1. iter ...

  3. ES6中的迭代器(Iterator)和生成器(Generator)

    前面的话 用循环语句迭代数据时,必须要初始化一个变量来记录每一次迭代在数据集合中的位置,而在许多编程语言中,已经开始通过程序化的方式用迭代器对象返回迭代过程中集合的每一个元素 迭代器的使用可以极大地简 ...

  4. ES6中的迭代器(Iterator)和生成器(Generator)(一)

    用循环语句迭代数据时,必须要初始化一个变量来记录每一次迭代在数据集合中的位置,而在许多编程语言中,已经开始通过程序化的方式用迭代器对象返回迭代过程中集合的每一个元素 迭代器的使用可以极大地简化数据操作 ...

  5. ES6入门十:iterator迭代器

    迭代模式 ES6迭代器标准化接口 迭代循环 自定义迭代器 迭代器消耗 一.迭代模式 迭代模式中,通常有一个包含某种数据集合的对象.该数据可能存在一个复杂数据结构内部,而要提供一种简单的方法能够访问数据 ...

  6. ES6 iterator 迭代器

    iterator使用TypeScript 的描述: interface Iterable { [Symbol.iterator]() : Iterator, } interface Iterator ...

  7. ES6的Iterator,jquery Fn

    ES6的Iterator对象详解 Iterator实现原理 创建一个指针对象,指向当前数据结构的起始位置.也就是说,遍历器对象本质上,就是一个指针对象. 第一次调用指针对象的next方法,可以将指针指 ...

  8. [js高手之路] es6系列教程 - 迭代器,生成器,for...of,entries,values,keys等详解

    接着上文[js高手之路] es6系列教程 - 迭代器与生成器详解继续. 在es6中引入了一个新的循环结构for ....of, 主要是用来循环可迭代的对象,那么什么是可迭代的对象呢? 可迭代的对象一般 ...

  9. Symbol.iterator 和 for of

    Symbol.iterator 和 for of 是es6的新特性 可以为对象设置 自己的迭代器 首先介绍我们的for of var arr = [1,2,3,8,33] for (var i of ...

  10. ES6中的迭代器、Generator函数以及Generator函数的异步操作

    最近在写RN相关的东西,其中涉及到了redux-saga ,saga的实现原理就是ES6中的Generator函数,而Generator函数又和迭代器有着密不可分的关系.所以本篇博客先学习总结了ite ...

随机推荐

  1. Codeforces Round #594 (Div. 1) D2. The World Is Just a Programming Task (Hard Version) 括号序列 思维

    D2. The World Is Just a Programming Task (Hard Version) This is a harder version of the problem. In ...

  2. 微信公众号开发 ,redirect_uri域名还是与后台配置不一致

    测试账号地址: https://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox/index https ...

  3. springboot+jpa分库分表项目实例

    分库分表场景 关系型数据库本身比较容易成为系统瓶颈,单机存储容量.连接数.处理能力都有限.当单表的数据量达到1000W或100G以后,由于查询维度较多,即使添加从库.优化索引,做很多操作时性能仍下降严 ...

  4. centos安装nodejs并配置生产环境,基于pm2

    安装nodejs和yarn的命令: curl --silent --location https://dl.yarnpkg.com/rpm/yarn.repo | sudo tee /etc/yum. ...

  5. Pytorch的tensor数据类型

    基本类型 torch.Tensor是一种包含单一数据类型元素的多维矩阵. Torch定义了七种CPU tensor类型和八种GPU tensor类型: Data tyoe CPU tensor GPU ...

  6. Leetcode练习题Longest Common Prefix

    Question: Longest Common Prefix Write a function to find the longest common prefix string amongst an ...

  7. asp.net core 新建area使用asp-action,asp-controller不管用

    解决方法: 在新建的Area目录下,这里使用Admin,Admin/Views下新建_ViewImports.cshtml和_ViewStart.cshtml两个视图文件,复制项目自动生成的到对应的新 ...

  8. js获取手机唯一标识码

    Device模块管理设备信息,用于获取手机设备的相关信息,如IMEI.IMSI.型号.厂商等.通过plus.device获取设备信息管理对象. imei: 设备的国际移动设备身份码 imsi: 设备的 ...

  9. JavaScript深入浅出第1课:箭头函数中的this究竟是什么鬼?

    <JavaScript 深入浅出>系列: JavaScript 深入浅出第 1 课:箭头函数中的 this 究竟是什么鬼? JavaScript 深入浅出第 2 课:函数是一等公民是什么意 ...

  10. 【转载】Android 的 Handler 机制实现原理分析

    handler在安卓开发中是必须掌握的技术,但是很多人都是停留在使用阶段.使用起来很简单,就两个步骤,在主线程重写handler的handleMessage( )方法,在工作线程发送消息.但是,有没有 ...