JS设计模式(4)迭代器模式
什么是迭代器模式?
定义:提供一种方法顺序访问一个聚合对象中各个元素, 而又无须暴露该对象的内部表示。
主要解决:不同的方式来遍历整个整合对象。
何时使用:遍历一个聚合对象。
如何解决:把在元素之间游走的责任交给迭代器,而不是聚合对象。
关键代码:定义接口:done, next。
优点: 1、它支持以不同的方式遍历一个聚合对象。 2、迭代器简化了聚合类。 3、在同一个聚合上可以有多个遍历。 4、在迭代器模式中,增加新的聚合类和迭代器类都很方便,无须修改原有代码。
缺点:由于迭代器模式将存储数据和遍历数据的职责分离,增加新的聚合类需要对应增加新的迭代器类,类的个数成对增加,这在一定程度上增加了系统的复杂性。
使用场景: 1、访问一个聚合对象的内容而无须暴露它的内部表示。 2、需要为聚合对象提供多种遍历方式。 3、为遍历不同的聚合结构提供一个统一的接口。
注意事项:迭代器模式就是分离了集合对象的遍历行为,抽象出一个迭代器来负责,这样既可以做到不暴露集合的内部结构,又可让外部代码透明地访问集合内部的数据。
实现一个内部的迭代器
function each(arr, fn) {
for (let i = 0; i < arr.length; i++) {
fn(i, arr[i])
}
}
each([1, 2, 3], function(i, n) {
console.log(i) // 0 1 2
console.log(n) // 1 2 3
})
可以看出内部迭代器在调用的时候非常简单,使用者不用关心迭代器内部实现的细节,但这也是内部迭代器的缺点。比如要比较两数组是否相等,只能在其回调函数中作文章了,代码如下:
const compare = function(arr1, arr2) {
each(arr1, function(i, n) {
if (arr2[i] !== n) {
console.log('两数组不等')
return
}
})
console.log('两数组相等')
}
const arr1 = [1, 2, 3]
const arr2 = [1, 2, 3]
compare(arr1, arr2) // 两数组相等
实现一个外部的迭代器
const iterator = function(arr) {
let current = 0
const next = function() {
current = current + 1
}
const done = function() {
return current >= arr.length
}
const value = function() {
return arr[current]
}
return {
next,
done,
value,
}
}
const arr1 = [1, 2 ,3]
const arr2 = [1, 2, 3]
const iterator1 = iterator(arr1)
const iterator2 = iterator(arr2)
const compare = function(iterator1, iterator2) {
while (!iterator1.done() && !iterator2.done()) {
if (iterator1.value() !== iterator2.value()) {
console.log('两数组不等')
return
}
iterator1.next() // 外部迭代器将遍历的权利转移到外部
iterator2.next()
}
console.log('两数组相等')
}
compare(iterator1, iterator2)
JS设计模式(4)迭代器模式的更多相关文章
- js设计模式——4.迭代器模式
js设计模式——4.迭代器模式 代码演示 /*js设计模式——迭代器模式*/ class Iterator { constructor(container) { this.list = contain ...
- js设计模式总结-迭代器模式
迭代器模式 要解决的问题 迭代器要解决的问题很简单很单纯,就是进行遍历操作. 实现原理 基本所有语言都实现了迭代器,javascript也不例外,如Array.prototype.forEach,fo ...
- 浅谈js设计模式之迭代器模式
迭代器模式无非就是循环访问聚合对象中的各个元素.比如 jQuery中的 $.each 函数,其中回调函数中的参数 i 为当前索引, n 为当前元素,代码如下: $.each([1, 2, 3], fu ...
- JS设计模式——5.单体模式
JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html 单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...
- 乐在其中设计模式(C#) - 迭代器模式(Iterator Pattern)
原文:乐在其中设计模式(C#) - 迭代器模式(Iterator Pattern) [索引页][源码下载] 乐在其中设计模式(C#) - 迭代器模式(Iterator Pattern) 作者:weba ...
- Python进阶:设计模式之迭代器模式
在软件开发领域中,人们经常会用到这一个概念——“设计模式”(design pattern),它是一种针对软件设计的共性问题而提出的解决方案.在一本圣经级的书籍<设计模式:可复用面向对象软件的基础 ...
- 设计模式学习--迭代器模式(Iterator Pattern)和组合模式(Composite Pattern)
设计模式学习--迭代器模式(Iterator Pattern) 概述 ——————————————————————————————————————————————————— 迭代器模式提供一种方法顺序 ...
- js设计模式——7.备忘录模式
js设计模式——7.备忘录模式 /*js设计模式——备忘录模式*/ // 备忘类 class Memento { constructor(content) { this.content = conte ...
- js设计模式——6.模板方法模式与职责链模式
js设计模式——6.模板方法模式与职责链模式 职责链模式
- js设计模式——5.状态模式
js设计模式——5.状态模式 代码演示 /*js设计模式——状态模式*/ // 状态(红灯,黄灯,绿灯) class State { constructor(color) { this.color = ...
随机推荐
- VS2017 安装打包插件
安装 打开VS2017:工具 --> 扩展和更新 --> 联机,搜索Microsoft Visual Studio 2017 Installer Projects,如下图: 在搜索中输入: ...
- 接口配置信息修改 请填写接口配置信息,此信息需要你有自己的服务器资源,填写的URL需要正确响应微信发送的Token验证
// 1)将token.timestamp.nonce三个参数进行字典序排序 // 2)将三个参数字符串拼接成一个字符串进行sha1加密 // 3)开发者获得加密后的字符串可与signature对比, ...
- 12.vue属性.监听.组件
1.计算属性 https://cn.vuejs.org/v2/guide/computed.html new Vue({ computed:{//定义 show(){ } } }) ++计算属性1.h ...
- 7 ArcMap能复制,不能粘贴
1:能复制不能粘贴 有时候在编辑数据的时候,需要在不同的shp层之间操作,往往有时候可以复制,但是粘贴那一项是灰色的 解决办法1:打开ArcScene,在关掉即可 解决办法2:如果是在编辑状态下,有时 ...
- hive reduce 阶段GC Exception
某个reduce中的value堆积的对象过多,导致jvm频繁GC. 解决办法: 1. 增加reduce个数,set mapred.reduce.tasks=300,. 2. 在hive-site.xm ...
- 用ps怎么修改照片的背景颜色??【申明:来源于网络】
用ps怎么修改照片的背景颜色??[申明:来源于网络] 地址:http://wenda.so.com/q/1361505315060523?src=140
- pytorch--nn.Sequential学习
nn.SequentialA sequential container. Modules will be added to it in the order they are passed in the ...
- [qemu] 差分盘使用
我要装好多台同样配置的虚拟机.比如10台CentOS7, 各自有不同的配置. 这样的话装10台kvm虚拟机,特别的浪费空间,image文件相互迁移的话也不方便. 这个时候可以选择差分盘:就是先装一个标 ...
- css3 伸缩百分比的调整
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Spring Boot 注解配置 day03
一.SpringBoot注解 @PropertySource 和 @ImportResource和@Bean 1.@PropertySource 加载指定位置的配置文件(只能是properties文件 ...