浦东区建设工程监督网站,沧州网站建设优化公司,美食网站建设策划报告,北京市工程建设交易中心本文以 用 for of遍历 Object 为引 来聊聊 迭代器模式。
什么是迭代器模式 迭代器模式提供一种方法顺序访问一个聚合对象中的各个元素#xff0c;而又不暴露该对象的内部表示。 ——《设计模式#xff1a;可复用面向对象软件的基础》 可以说迭代器模式就是为了遍历存在的。提…
本文以 用 for of遍历 Object 为引 来聊聊 迭代器模式。
什么是迭代器模式 迭代器模式提供一种方法顺序访问一个聚合对象中的各个元素而又不暴露该对象的内部表示。 ——《设计模式可复用面向对象软件的基础》 可以说迭代器模式就是为了遍历存在的。提到遍历大家都对那些手段耳熟能详了下面我们先简单列一下各种数据类型的遍历
遍历数组
for 循环forEachmapreducekeysvaluesfor of......
其中keys values for of 需要Iterator支持后面会介绍Iterator
遍历 Map/Set
keysentriesforEach......
遍历 Object
for in先Object.keys(obj)得到对象每个属性的数组, 然后使用数组的遍历方法遍历每个 key就能获取 每个 key 对应的 value
Iterator 和 for of
Iterator是ES6提出的一个接口为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署 Iterator 接口就可以完成遍历操作。
Iterator 的作用
为各种数据结构提供一个统一的、简便的访问接口。ES6提出了新的遍历命令for...of循环Iterator 接口主要供for...of消费。
Iterator 的遍历过程
既然数组是支持for...of循环的那数组肯定部署了 Iterator 接口我们通过它来看看Iterator 的遍历过程。 从图中我们能看出
Iterator 接口返回了一个有next方法的对象。每调用一次 next依次返回了数组中的项直到它指向数据结构的结束位置。返回的结果是一个对象对象中包含了当前值value 和 当前是否结束done
用 for of 遍历 Object
回到标题中的问题我们现在如何去让一个对象也可以用 for of 来遍历它呢 根据上面讲到的内容需要给对象也部署 Iterator 接口其实就是在Object.prototype上实现一个以Symbol.iterator为名的function这个function返回一个有next方法的对象每调用一次 next, 能够依次返回数组中的项直到它指向数据结构的结束位置
function objectIterator() {const keys Object.keys(this)let index 0return {next: () {const done index keys.lengthconst value done ? undefined : this[keys[index]]indexreturn {done,value}}}
}Object.prototype[Symbol.iterator] objectIteratorconst obj {key: 1,value: 2
}for (const iterator of obj) {console.log(iterator)
} 大厂面试题分享 面试题库
前后端面试题库 面试必备 推荐★★★★★
地址前端面试题库 web前端面试题库 VS java后端面试题库大全
