迭代器模式无非就是循环访问聚合对象中的各个元素。比如 jQuery中的 $.each 函数,其中回
调函数中的参数 i 为当前索引, n 为当前元素,代码如下:

$.each([1, 2, 3], function(i, n) {
console.log('当前下标为: ' + i);
console.log('当前值为:' + n);
});

现在我们来自己实现一个 each 函数, each 函数接受 2 个参数,第一个为被循环的数组,第
二个为循环中的每一步后将被触发的回调函数:

var each = function(ary, callback) {
for(var i = 0, l = ary.length; i < l; i++) {
callback.call(ary[i], i, ary[i]); // 把下标和元素当作参数传给 callback 函数
}
};
each([1, 2, 3], function(i, n) {
alert([i, n]);
});

迭代器模式不仅可以迭代数组,还可以迭代一些类数组的对象。比如 arguments 、
{"0":'a',"1":'b'} 等。 通过上面的代码可以观察到,无论是内部迭代器还是外部迭代器,只要被
迭代的聚合对象拥有 length 属性而且可以用下标访问,那它就可以被迭代。
在 JavaScript 中, for in 语句可以用来迭代普通字面量对象的属性。jQuery 中提供了$.each`
函数来封装各种迭代行为:

$.each = function(obj, callback) {
var value,
i = 0,
length = obj.length,
isArray = isArraylike(obj);
if(isArray) { // 迭代类数组
for(; i < length; i++) {
value = callback.call(obj[i], i, obj[i]);
if(value === false) {
break;
}
}
} else {
for(i in obj) { // 迭代 object 对象
value = callback.call(obj[i], i, obj[i]);
if(value === false) {
break;
}
}
}
return obj;
};

浅谈js设计模式之迭代器模式的更多相关文章

  1. 浅谈js设计模式之代理模式

    代理模式是一种非常有意义的模式,在生活中可以找到很多代理模式的场景.比如,明星都有经纪人作为代理.如果想请明星来办一场商业演出,只能联系他的经纪人.经纪人会把商业演出的细节和报酬都谈好之后,再把合同交 ...

  2. 浅谈js设计模式 — 享元模式

    享元(flyweight)模式是一种用于性能优化的模式,“fly”在这里是苍蝇的意思,意为蝇量级.享元模式的核心是运用共享技术来有效支持大量细粒度的对象. 假设有个内衣工厂,目前的产品有 50种男式内 ...

  3. 浅谈js设计模式之策略模式

    策略模式有着广泛的应用.本节我们就以年终奖的计算为例进行介绍. 很多公司的年终奖是根据员工的工资基数和年底绩效情况来发放的.例如,绩效为 S的人年终奖有 4倍工资,绩效为 A的人年终奖有 3倍工资,而 ...

  4. js设计模式——4.迭代器模式

    js设计模式——4.迭代器模式 代码演示 /*js设计模式——迭代器模式*/ class Iterator { constructor(container) { this.list = contain ...

  5. js设计模式总结-迭代器模式

    迭代器模式 要解决的问题 迭代器要解决的问题很简单很单纯,就是进行遍历操作. 实现原理 基本所有语言都实现了迭代器,javascript也不例外,如Array.prototype.forEach,fo ...

  6. 浅谈Python设计模式 -- 责任链模式

    声明:本系列文章主要参考<精通Python设计模式>一书,并且参考一些资料,结合自己的一些看法来总结而来. 之前在最开始就聊了Python设计模式有三种,其中关于创建型和结构型设计模式基本 ...

  7. 浅谈js设计模式 — 命令模式

    命令模式最常见的应用场景是:有时候需要向某些对象发送请求,但是并不知道请求的接收者是谁,也不知道被请求的操作是什么.此时希望用一种松耦合的方式来设计程序,使得请求发送者和请求接收者能够消除彼此之间的耦 ...

  8. 浅谈js设计模式之发布 — 订阅模式

    发布 — 订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知.在 JavaScript开发中,我们一般用事件模型来替代传统的发布 — ...

  9. 浅谈Python设计模式 - 享元模式

    声明:本系列文章主要参考<精通Python设计模式>一书,并且参考一些资料,结合自己的一些看法来总结而来. 享元模式: 享元模式是一种用于解决资源和性能压力时会使用到的设计模式,它的核心思 ...

随机推荐

  1. Docker(二十一)-Docker Swarm集群部署

    介绍 Swarm 在 Docker 1.12 版本之前属于一个独立的项目,在 Docker 1.12 版本发布之后,该项目合并到了 Docker 中,成为 Docker 的一个子命令.目前,Swarm ...

  2. Oracle DROPtable以及Truncate table 的简单测试

    1. 一个用户库 有一个业务表比较大 大小是 49g 表的行数为:121546147 一亿两千万行 制作一个虚拟机的快照测试一下 drop table 和 truncate table的性能差距 2. ...

  3. ESXi 系统管理员命令 [转帖]

    来源 https://blog.csdn.net/zy_strive_2012/article/details/53336000 正如所有的虚拟化管理员都知道,要应对VMware基础设施上需要的更多虚 ...

  4. 解决SVN安装语言包后无法选择中文的问题(亲测可行)

    TortoiseSVN_1.8.8安装后无法选择简体中文,或者安装语言包后也无法选择中文 1.找到 SVN 安装目录,把里面的Languages文件夹删掉 2.安装语言包,百度一下也有很多安装包和语言 ...

  5. 【Webpack2.X笔记】 配合react项目进行配置

    前言: 本文是自己在工作中使用webpack进行react开发项目构建的一些经验总结,做以记录防范后续踩坑. 如果您还没有webpack相关基础,请先移步 入门Webpack,看这篇就够了 进行基础学 ...

  6. 常用的sublime text 3插件(很爽哦)

    个人比较懒,平时喜欢用webstorm,但是因为webstorm打开实在太慢了,并且太看设备,所以本人编辑简单的文件依然会选择使用sublime,虽然网上有很多关于此类插件的分享了,但是感觉都是片段, ...

  7. KUR-Couriers

    题目链接: QwQ Solution: 以权值为下标,对每个点建树 对于x点,以它为根的树涵盖的是1到x区间内每个数出现的次数 Code: #include<bits/stdc++.h> ...

  8. THUWC2019爆零记

    Day -1 现在在机房里,准备敲敲板子什么的. 今天晚上放假诶,要好好睡一下.好好睡是不可能的,这辈子不可能的. Day 0 现在在酒店,\(lwh\)神仙在超越,我打了个\(treap\)的板子就 ...

  9. 解决360WiFi有时候手机连接不上

    有可能是无线网卡的问题: 右击“计算机”->选择“管理”->“设备管理器”->网络适配器->选择“Broadcom  802.11n 网络适配器”,或者你实在不知道哪个是无线网 ...

  10. 前端常用功能记录(二)—datatables表格

    并不是所有的后台开发都有美工和前端工程师来配合做页面,为了显示数据并有一定的美感,jQuery的DataTables插件对于像我这样的前端菜鸟来说真是雪中送炭,当然对于专业的前端开发者来说它更是锦上添 ...