首页
友链
壁纸
留言
今日热榜
更多
关于
时光
推荐
精品流量卡
Search
1
都二十多年了,你的梦为什么还没碎!
57,062 阅读
2
2022年5个好用的 BT/ 磁力链接下载工具推荐 |Windows 、安卓系统
37,220 阅读
3
nps内网穿透实现外网访问树莓派
32,390 阅读
4
实践利用宝塔建emlog个人博客-超详细【原创】
26,120 阅读
5
Typecho-Joe-Theme主题帮助文档
24,551 阅读
闲杂乱码
Python
网站源码
微信小程序
娱乐分享
Is相册
软件工具
登录
Search
标签搜索
PHP
HTML
API
Javascript
源码
JS
Vue
Github
CloudFlare
接口
函数
SQL
ASP.NET
MVC
EF
T4模板
后台管理
CDN
微信小程序
MAC
韩小韩
累计撰写
261
篇文章
累计收到
1,302
条评论
首页
栏目
闲杂乱码
Python
网站源码
微信小程序
娱乐分享
Is相册
软件工具
页面
友链
壁纸
留言
今日热榜
关于
时光
推荐
精品流量卡
搜索到
1
篇与
迭代器
的结果
2021-07-17
Javascript迭代器
{message type="info" content="我们都知道可以用 for...of... 来循环可迭代对象,例如循环"/}Array Arguments Map Set String TypedArray NodeList迭代器的工作原理创建一个指针,指向当前数据结构的起始位置第一次调用对象next方法,指针自动指向数据结构的第一个成员接下来不断调用next,指针一直往后移动,直到指向最后一个成员每调用一次next方法返回一个包含value和done属性的对象为什么Object不可以被迭代let arr = [1, 2, 3] let obj = { a: 1, b: 2, c: 3 } for(let val of arr) { console.log(val) } for(let val of obj) { console.log(val) }接着运行上面的代码,会出现以下报错信息: {callout color="#4d75ef"}可以看到,数组正常循环没有问题,但是到了obj,会报:obj is not iterable(obj不是一个可迭代对象、obj不可被迭代)这是为什么呢?将arr和obj分别使用 console.dir() 进行打印查看{/callout}{callout color="#ef4d7e"}可以看到,arr的原型上挂载着一个 Symbol[Symbol.iterator],而obj的原型上并没有这个属性,因此这就是为什么obj不可以被迭代的原因但是如果非得让obj也成为一个 可迭代对象,如何去实现呢?此时就需要给obj身上加上一个迭代器{/callout}let obj = { a: 1, b: 2, c: 3, [Symbol.iterator]: function () { let values = Object.values(obj) let index = 0 /* 必须得return 一个对象出去 */ return { /* 这是固定写法 */ next() { if (index >= values.length) { return { done: true // 此时迭代结束,就不需要再return value出去 } } else { return { value: values[index++], done: false } } } } } } for (let item of obj) { console.log(item) }{callout color="#f0ad4e"}运行上方的代码,此时obj已经可以使用 for...of... 进行循环,并且此时的obj已经是一个可迭代对象{/callout}迭代器利用for of 自定义遍历数据let obj = { a: 1, b: 2, c: [ '小韩', '小徐', '小悦' ], [Symbol.iterator]: function () { let idx = 0; const _c = this.c return { next() { return idx < _c.length ? { value: _c[idx++], done: false } : { value: undefined, done: true } } } } } let values = obj[Symbol.iterator]() console.log(values) // 得到迭代器对象,里面含有next方法 console.log(values.next()) // done:false(表示可以继续迭代),并且value为 小韩 console.log(values.next()) // done:false(表示可以继续迭代),并且value为 小徐 console.log(values.next()) // done:false(表示可以继续迭代),并且value为 小悦 console.log(values.next()) // done:true(表示迭代结束)总结{callout color="#964def"}迭代协议:规定迭代与实现的逻辑(也就是上面迭代器里的逻辑)迭代器:具体的迭代实现逻辑(也就是上面的迭代器函数)迭代对象:可被迭代的对象,已经实现[Symbol.iterator]方法的对象(就是上面加了迭代器后的obj){/callout}
2021年07月17日
963 阅读
0 评论
3 点赞