当前位置: 首页 > news >正文

【设计模式】模板方法模式和迭代器模式

模板方法模式

模板方法模式由两部分组成,第一部分是抽象父类,第二部分是具体的实现子类。通常在抽象父类中封装了
子类的算法框架,包括实现一此公共方法以及封装子类中所有方法的执行顺序。子类通过继承这个抽象类,
也继承了整个算结构,并且可以选择重写父类的方法。

// 模板方法模式
const Template = function (params) {this.params = params
}Template.prototype = {init() {this.start()this.end()},start() {console.log('start')},end() {console.log('end')}
}
const Child = function (params) {Template.call(this, params)
}// 继承 Template 的原型
Child.prototype = Object.create(Template.prototype)
Child.prototype.constructor = Child// 使用
const child = new Child()
child.init()

模板方法模式时一种典型的通过封装变化提高系统扩展性的设计模式。运用了模板方法模式的程序中,子类方法种类和执行顺序都是不变的,但是子类的方法具体实现则是可变的。父类是个模板,子类可以添加,就增加了不同的功能。

迭代器模式

迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。

  1. 为遍历不同数据结构的“集合”提供统一的接口
  2. 能遍历访问“集合”数据中的项,不关心项的数据结构
// 1. 最简单的迭代器模式
const myEach = function (arr, fn) {for (let i = 0; i < arr.length; i++) {fn(i, arr[i])}
}
/*** 0 1* 1 2* 2 3* 3 4* 4 5*/
myEach([1, 2, 3, 4, 5], (index, value) => {console.log(index, value)
})// 2. es6 中的迭代器
const arr = [1, 2, 3, 4, 5]
// for (let item of arr) {
//     console.log(item)
// }
const it = arr[Symbol.iterator]()
/*** { value: 1, done: false }* { value: 2, done: false }* { value: 3, done: false }* { value: 4, done: false }* { value: 5, done: false }* { value: undefined, done: true }*/
console.log(it.next())
console.log(it.next())
console.log(it.next())
console.log(it.next())
console.log(it.next())
console.log(it.next())// 3. 自定义迭代器
// 具备迭代器的数据结构 Array Map Set String TypedArray arguments NodeList
// 类数组的对象
const obj = {0: 'a',1: 'b',2: 'c',length: 3,[Symbol.iterator]: Array.prototype[Symbol.iterator]
}
for (const objElement of obj) {console.log(objElement)
}
// 普通对象
const obj2 = {a: 'a',b: ['b', 'b'],c: 1,length: 3,[Symbol.iterator]: function () {let index = 0// 要么保留 this,要么使用 箭头函数 使this 指向 obj2const that = thisreturn {next: function () {if (index < that.length) {return {value: that[Object.keys(that)[index++]],done: false}} else {return {value: undefined,done: true}}}}}
}
for (let obj2Element of obj2) {console.log(obj2Element)
}

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • 【Docker】Linux系统以及威联通QNAP部署思源笔记的通用教程
  • css实现闪烁渐变背景,@property自定义属性
  • 一次了解所有功能!超详细【Stable Diffusion界面】大揭秘!
  • 简过网:报个线上公务员培训班大概要多少钱?
  • 警惕!低血糖来袭,这些“隐形信号”你中招了吗?
  • 解决LabVIEW配置文件中文乱码问题
  • 【项目】微服务及时通讯系统:编写核心类
  • 拼车系统开发方案
  • Android about event log
  • 《通义千问AI落地—中》:前端实现
  • C语言程序设计(初识C语言后部分)
  • Compose(7)交互和动画
  • 第二节:Nodify 添加节点到编辑器中
  • 【GH】【EXCEL】P3: Set Conditional Formatting To Excel Data By Gh
  • Vue.js学习笔记(七)使用sortablejs或el-table-draggable拖拽ElementUI的el-table表格组件
  • ECMAScript 6 学习之路 ( 四 ) String 字符串扩展
  • ES10 特性的完整指南
  • Hexo+码云+git快速搭建免费的静态Blog
  • interface和setter,getter
  • js面向对象
  • js学习笔记
  • Just for fun——迅速写完快速排序
  • python 学习笔记 - Queue Pipes,进程间通讯
  • Spring Cloud Alibaba迁移指南(一):一行代码从 Hystrix 迁移到 Sentinel
  • SpringBoot 实战 (三) | 配置文件详解
  • SpringCloud(第 039 篇)链接Mysql数据库,通过JpaRepository编写数据库访问
  • 阿里中间件开源组件:Sentinel 0.2.0正式发布
  • 从tcpdump抓包看TCP/IP协议
  • 人脸识别最新开发经验demo
  • 小试R空间处理新库sf
  • 智能合约开发环境搭建及Hello World合约
  • 06-01 点餐小程序前台界面搭建
  • 新年再起“裁员潮”,“钢铁侠”马斯克要一举裁掉SpaceX 600余名员工 ...
  • ​zookeeper集群配置与启动
  • ‌‌雅诗兰黛、‌‌兰蔻等美妆大品牌的营销策略是什么?
  • #laravel 通过手动安装依赖PHPExcel#
  • $.ajax()方法详解
  • (02)Cartographer源码无死角解析-(03) 新数据运行与地图保存、加载地图启动仅定位模式
  • (1综述)从零开始的嵌入式图像图像处理(PI+QT+OpenCV)实战演练
  • (4)事件处理——(7)简单事件(Simple events)
  • (DenseNet)Densely Connected Convolutional Networks--Gao Huang
  • (Note)C++中的继承方式
  • (附源码)php新闻发布平台 毕业设计 141646
  • (黑客游戏)HackTheGame1.21 过关攻略
  • (回溯) LeetCode 46. 全排列
  • (离散数学)逻辑连接词
  • (论文阅读笔记)Network planning with deep reinforcement learning
  • (转)C#调用WebService 基础
  • .Net CF下精确的计时器
  • .NET 回调、接口回调、 委托
  • .NET 设计模式初探
  • .Net组件程序设计之线程、并发管理(一)
  • /bin/rm: 参数列表过长"的解决办法
  • @RequestBody与@RequestParam:Spring MVC中的参数接收差异解析
  • [ vulhub漏洞复现篇 ] Apache Flink目录遍历(CVE-2020-17519)