深入理解JavaScript系列(35):设计模式之迭代器模式详解


Posted in Javascript onMarch 03, 2015

介绍

迭代器模式(Iterator):提供一种方法顺序一个聚合对象中各个元素,而又不暴露该对象内部表示。

迭代器的几个特点是:

1.访问一个聚合对象的内容而无需暴露它的内部表示。
2.为遍历不同的集合结构提供一个统一的接口,从而支持同样的算法在不同的集合结构上进行操作。
3.遍历的同时更改迭代器所在的集合结构可能会导致问题(比如C#的foreach里不允许修改item)。

正文

一般的迭代,我们至少要有2个方法,hasNext()和Next(),这样才做做到遍历所有对象,我们先给出一个例子:

var agg = (function () {

    var index = 0,

    data = [1, 2, 3, 4, 5],

    length = data.length;
    return {

        next: function () {

            var element;

            if (!this.hasNext()) {

                return null;

            }

            element = data[index];

            index = index + 2;

            return element;

        },
        hasNext: function () {

            return index < length;

        },
        rewind: function () {

            index = 0;

        },
        current: function () {

            return data[index];

        }
    };

} ());

使用方法和平时C#里的方式是一样的:
// 迭代的结果是:1,3,5

while (agg.hasNext()) {

    console.log(agg.next());

}

当然,你也可以通过额外的方法来重置数据,然后再继续其它操作:
// 重置

agg.rewind();

console.log(agg.current()); // 1

jQuery应用例子

jQuery里一个非常有名的迭代器就是$.each方法,通过each我们可以传入额外的function,然后来对所有的item项进行迭代操作,例如:

$.each(['dudu', 'dudu', '酸奶小妹', '那个MM'], function (index, value) {

    console.log(index + ': ' + value);

});

//或者

$('li').each(function (index) {

    console.log(index + ': ' + $(this).text());

});

总结

迭代器的使用场景是:对于集合内部结果常常变化各异,我们不想暴露其内部结构的话,但又响让客户代码透明底访问其中的元素,这种情况下我们可以使用迭代器模式。

Javascript 相关文章推荐
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
Nov 30 Javascript
js获取对象为null的解决方法
Nov 21 Javascript
使用js操作css实现js改变背景图片示例
Mar 10 Javascript
JavaScript字符串对象charAt方法入门实例(用于取得指定位置的字符)
Oct 17 Javascript
node.js中使用socket.io制作命名空间
Dec 15 Javascript
jquery模拟多级复选框效果的简单实例
Jun 08 Javascript
jQuery插件HighCharts实现的2D堆条状图效果示例【附demo源码下载】
Mar 14 Javascript
javascript观察者模式实现自动刷新效果
Sep 05 Javascript
基于javascript中的typeof和类型判断(详解)
Oct 27 Javascript
Vue动态获取width的方法
Aug 22 Javascript
javascript实现摄像头拍照预览
Sep 30 Javascript
angular8和ngrx8结合使用的步骤介绍
Dec 01 Javascript
jQuery选择器之基本选择器与层次选择器
Mar 03 #Javascript
JS实现在网页中弹出一个输入框的方法
Mar 03 #Javascript
深入理解JavaScript系列(34):设计模式之命令模式详解
Mar 03 #Javascript
深入理解JavaScript系列(33):设计模式之策略模式详解
Mar 03 #Javascript
JavaScript模拟重力状态下抛物运动的方法
Mar 03 #Javascript
深入理解JavaScript系列(31):设计模式之代理模式详解
Mar 03 #Javascript
深入理解JavaScript系列(30):设计模式之外观模式详解
Mar 03 #Javascript
You might like
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
谈谈PHP中substr和substring的正确用法及相关参数的介绍
2015/12/16 PHP
Javascript实现的分页函数
2006/12/22 Javascript
关于js new Date() 出现NaN 的分析
2012/10/23 Javascript
Js注册协议倒计时的小例子
2013/06/24 Javascript
批量实现面向对象的实例代码
2013/07/01 Javascript
javascript实现捕捉键盘上按下的键
2015/05/05 Javascript
再JavaScript的jQuery库中编写动画效果的指南
2015/08/13 Javascript
javascript弹出窗口实现代码
2015/11/12 Javascript
Document.body.scrollTop的值总为零的快速解决办法
2016/06/09 Javascript
使用bootstrap validator的remote验证代码经验分享(推荐)
2016/09/21 Javascript
通过网页查看JS源码中汉字显示乱码的解决方法
2016/10/26 Javascript
Easyui在treegrid添加控件的实现方法
2017/06/23 Javascript
Nodejs+express+ejs简单使用实例代码
2017/09/18 NodeJs
jQuery实现简单的下拉菜单导航功能示例
2017/12/07 jQuery
详解key在Vue列表渲染时究竟起到了什么作用
2019/04/20 Javascript
微信小程序实现卡片左右滑动效果的示例代码
2019/05/01 Javascript
微信小程序实现滚动加载更多的代码
2019/12/06 Javascript
微信小程序使用自定义组件导航实现当前页面高亮
2020/01/02 Javascript
基于Python实现的ID3决策树功能示例
2018/01/02 Python
解决python 自动安装缺少模块的问题
2018/10/22 Python
Python3匿名函数lambda介绍与使用示例
2019/05/18 Python
python实现静态服务器
2019/09/05 Python
django框架基于queryset和双下划线的跨表查询操作详解
2019/12/11 Python
HTML5新增属性data-*和js/jquery之间的交互及注意事项
2017/08/08 HTML / CSS
菲律宾酒店预订网站:Hotels.com菲律宾
2017/07/12 全球购物
俄罗斯皮肤健康中心:Pharmacosmetica.ru
2020/02/22 全球购物
莫斯科制造商的廉价皮大衣:Fursk
2020/06/09 全球购物
自动化毕业生专业自荐书范文
2014/02/04 职场文书
个人查摆剖析材料
2014/02/04 职场文书
社区爱国卫生月活动总结
2014/06/30 职场文书
教师职业道德事迹材料
2014/08/18 职场文书
小班教师个人总结
2015/02/05 职场文书
聊聊Python中关于a=[[]]*3的反思
2021/06/02 Python
idea 在springboot中使用lombok插件的方法
2021/08/02 Java/Android
一文弄懂MySQL索引创建原则
2022/02/28 MySQL