十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
本篇内容介绍了“JavaScript迭代器怎么自定义”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!
创新互联公司主要为客户提供服务项目涵盖了网页视觉设计、VI标志设计、全网整合营销推广、网站程序开发、HTML5响应式网站建设、成都做手机网站、微商城、网站托管及网站维护公司、WEB系统开发、域名注册、国内外服务器租用、视频、平面设计、SEO优化排名。设计、前端、后端三个建站步骤的完善服务体系。一人跟踪测试的建站服务标准。已经为垃圾桶行业客户提供了网站维护服务。
迭代器就是一种接口机制,为各种不同的数据结构提供统一访问的机制。(即为了让一些不支持遍历的数据结构可遍历)
最常见的就是Array迭代器,按顺序返回数组中的值。
let arr = [1,2,3,4,5];for (let val of arr) { console.log(val);}
那么我们如何实现迭代器呢?
首先,它需要满足两点:
可迭代协议
迭代器协议
可迭代协议允许 JavaScript 对象定义或定制它们的迭代行为
如何满足可迭代协议 ?
要成为可迭代对象, 一个对象必须实现 @@iterator 方法。
这意味着对象(或者它原型链上的某个对象)必须有一个键为@@iterator 的属性,可通过常量 Symbol.iterator 访问该属性
也就是说要想满足可迭代协议,那么你的对象需要有一个键名为Symbol.iterator
的属性,使其成为可迭代对象。
迭代器协议定义了产生一系列值(无论是有限个还是无限个)的标准方式。
当值为有限个时,所有的值都被迭代完毕后,则会返回一个默认返回值。
如何满足迭代器协议 ?
你的对象需要至少实现一个next()
方法,这个方法返回一个迭代器对象IteratorResult
。这个迭代器对象包含两个属性done
和·value
。
done:
如果迭代器可以产生序列中的下一个值,则为 false。
如果迭代器已将序列迭代完毕,则为 true
value
迭代器返回的值。done 为 true 时可省略
那么我们接下来开始自定义一个迭代器
由前文所讲,要想自定义迭代器,需要符合以下两个条件:
成为可迭代对象,即有一个 Symbol.iterator
属性
(即可迭代协议:Symbol.iterator)
该迭代器对象返回一个 next()
方法,这个 next()
方法返回一个包含value
和 done
属性的对象
(即迭代器协议:return { next() { return { value, done } })
let colors = { blue : "蓝色", green : "绿色", yellow : "黄色"}
colors 现在是一个不可迭代对象,我们想使用 for…of 对其进行遍历,那么就可以自定义迭代器。
接下来,开始实现:
colors[Symbol.iterator] = function() { let keys = Object.keys(colors); // 如果用 let keys = Reflect.ownKeys(colors),keys 就会包括一些不可枚举的属性 // 那么后面的 len 要减一,减去Symbol.iterator这个属性 // 根据实际情况选择使用 let len = keys.length; let index = 0; return { next : function() { if (index < len) { return { value : colors[keys[index++]], done : false } } return { done : true } } }}
让我们对其验证一下:
for (let val of colors) { console.log(val);}
“JavaScript迭代器怎么自定义”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联网站,小编将为大家输出更多高质量的实用文章!