javascript设计模式 ? 迭代器模式原理与用法实例分析


Posted in Javascript onApril 17, 2020

本文实例讲述了javascript设计模式 ? 迭代器模式原理与用法。分享给大家供大家参考,具体如下:

介绍:迭代器模式是一种使用频率非常高的设计模式,通过引入迭代器,可以将数据的遍历功能从聚合对象中分离出来。迭代器模式用于顺序访问集合对象的元素,不需要知道集合对象的底层表示。

定义:提供一种方法来访问聚合对象,而不用暴露这个对象的内部表示,其别名为游标(Cursor)。迭代器模式是一种对象行为型模式。

场景:我们做一个百家姓的迭代器

示例:

function NameRepository(){
  var names = ['赵','钱','孙','李'];
 
  this.getIterator = function(){
    return new NameIterator();
  }
 
  function NameIterator(){
    var index = 0;
    //判断是否存在下一个元素
    this.hasNext = function(){
      return index < names.length;
    }
    //将游标指向第一个元素
    this.first = function(){
      index = 0;
    }
    //获取游标指向的当前元素
    this.currentItem = function(){
      return names[index];
    }
    this.next = function(){
      if(this.hasNext()){
        return names[index++]
      }
      return null;
    }
  }
}
 
var nameRepository = new NameRepository();
for(var iter = nameRepository.getIterator(); iter.hasNext();){
  console.log(iter.next())
}
// 赵
// 钱
// 孙
// 李

例子中NameIterator称为具体迭代器,它实现了对聚合对象的遍历,通过游标index来记录聚合对象当前位置,游标通常为一个表示位置的非负整数。

需要注意的是迭代器的接口设计非常重要,一方面要充分满足各种遍历操作的要求,另一方面又不能包含太多方法。

迭代器模式总结:

优点:
* 支持以不同的方式遍历一个聚合对象,在同一个聚合对象上可以定义多种遍历方式
* 迭代器简化了聚合类,原有的聚合对象不需要自行提供数据遍历方法。

缺点:
* 迭代器模式将存储数据和遍历数据的职责分离,一定程度增加了系统的复杂性
* 迭代器设计难度较大,需要充分考虑可扩展性。

适用场景:
* 访问一个聚合对象的内容而无须暴露它的内部表示。
* 需要为一个聚合对象提供多种遍历方式
* 为便利不同的聚合结构提供一个统一的接口,为不同的聚合结构实现不同的遍历方式。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
超清晰的document对象详解
Feb 27 Javascript
js form 验证函数 当前比较流行的错误提示
Jun 23 Javascript
针对初学者的jQuery入门指南
Aug 15 Javascript
使用bootstrap3开发响应式网站
May 12 Javascript
Js查找字符串中出现次数最多的字符及个数实例解析
Sep 05 Javascript
用jQuery.ajaxSetup实现对请求和响应数据的过滤
Dec 20 Javascript
利用node.js写一个爬取知乎妹纸图的小爬虫
May 03 Javascript
基于Vue实现图书管理功能
Oct 17 Javascript
vue中简单弹框dialog的实现方法
Feb 26 Javascript
linux 后台运行node服务指令方法
May 23 Javascript
JS双向链表实现与使用方法示例(增加一个previous属性实现)
Jan 31 Javascript
vue全局使用axios的操作
Sep 08 Javascript
vue制作抓娃娃机的示例代码
Apr 17 #Javascript
Vue+tracking.js 实现前端人脸检测功能
Apr 16 #Javascript
tracking.js实现前端人脸识别功能
Apr 16 #Javascript
electron 如何将任意资源打包的方法步骤
Apr 16 #Javascript
vue中keep-alive内置组件缓存的实例代码
Apr 16 #Javascript
详解Nuxt内导航栏的两种实现方式
Apr 16 #Javascript
javascript设计模式 ? 职责链模式原理与用法实例分析
Apr 16 #Javascript
You might like
第四节 构造函数和析构函数 [4]
2006/10/09 PHP
PHP 数组入门教程小结
2009/05/20 PHP
PHP附件下载中文名称乱码的解决方法
2015/12/17 PHP
php微信公众平台配置接口开发程序
2016/09/22 PHP
CI框架附属类用法分析
2018/12/26 PHP
NiftyCube——轻松实现圆角边框
2007/02/20 Javascript
jquery 简短右键菜单 多浏览器兼容
2010/01/01 Javascript
jquery 图片轮换效果
2010/07/29 Javascript
有关JavaScript的10个怪癖和秘密分享
2011/08/28 Javascript
jQuery对象和Javascript对象之间转换的实例代码
2013/03/20 Javascript
javascript自动给文本url地址增加链接的方法分享
2014/01/20 Javascript
JS输入用户名自动显示邮箱后缀列表的方法
2015/01/27 Javascript
jQuery实现点击图片翻页展示效果的方法
2015/02/16 Javascript
javascript实现复选框选中属性
2015/03/25 Javascript
js实现横向伸展开的二级导航菜单代码
2015/08/28 Javascript
全面解析Bootstrap手风琴效果
2020/04/17 Javascript
jQuery的each循环用法简单示例
2016/06/12 Javascript
使用jquery的jsonp如何发起跨域请求及其原理详解
2017/08/17 jQuery
微信小程序分享功能之按钮button 边框隐藏和点击隐藏
2018/06/14 Javascript
微信小程序实现banner图轮播效果
2020/06/28 Javascript
了解JavaScript函数中的默认参数
2019/05/30 Javascript
vue-cli脚手架引入弹出层layer插件的几种方法
2019/06/24 Javascript
element-ui table组件如何使用render属性的实现
2019/11/04 Javascript
JavaScript简单编程实例学习
2020/02/14 Javascript
jQuery实现中奖播报功能(让文本滚动起来) 简单设置数值即可
2020/03/20 jQuery
python抓取网页中的图片示例
2014/02/28 Python
windows及linux环境下永久修改pip镜像源的方法
2016/11/28 Python
Python实现小数转化为百分数的格式化输出方法示例
2017/09/20 Python
在python中求分布函数相关的包实例
2020/04/15 Python
英国首屈一指的票务公司:See Tickets
2019/05/11 全球购物
大学毕业感言100字
2014/02/03 职场文书
小学母亲节活动总结
2015/02/10 职场文书
2014年度个人工作总结范文
2015/03/09 职场文书
有关朝花夕拾的读书笔记
2015/06/29 职场文书
八年级作文之我的母亲
2019/12/10 职场文书
frg-100简单操作(设置)说明
2022/04/05 无线电