JavaScript 设计模式(六) 迭代器模式

xiongzenghui 发布于2019-08-26 13:22 / 1514人阅读

摘要：迭代器模式可以把迭代的过程从业务逻辑中分离出来，在使用迭代器模式后，即使不关心内部构造，也可以按顺序访问其他的每个元素。中的迭代器迭代器模式无非就是循环访问聚合对象中的各个元素。目前绝大部分都内置了迭代器

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

jquery中的迭代器

迭代器模式无非就是循环访问聚合对象中的各个元素。比如jquery中的each函数。

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

内部迭代器

jquery的each其实属于内部迭代器，函数内部定义好了迭代规则，外部只需要一次初始调用即可。

缺点：由于内部迭代器的迭代规则已经写好，所以无法迭代多个

var each = function(ary, callback){
    for(let i = 0, l=ary.length; i
假如现在有个需求，要判断2个数组里的值是否完全相等，如果不改写each里的代码，那么入手的就只能是each的回调函数了
var each = function(ary, callback){
    for(let i = 0, l=ary.length; i
外部迭代器
外部迭代器必须显示的请求迭代下一个元素 
优点：增强了迭代器的灵活性,可以手工控制迭代的过程或者顺序 
缺点：增加了调用的复杂度
下面用外部迭代器改写上面那个需求
var Iterator = function(obj){
    var current = 0
    var next = function(){
        current += 1
    }
    var isDone = function(){
        return current >= obj.length
    }
    var getCurrItem = function(){
        return obj[current]
    }
    return {
        next,
        isDone,
        getCurrItem
    }
}

var compare = function(iterator1, iterator2) {
    while(!iterator1.isDone() && !iterator2.isDone()) {
        if(iterator1.getCurrItem() !== iterator2.getCurrItem()){
            throw new Error("iterator1和iterator2不相等")
        }
        iterator1.next()
        iterator2.next()
    }
    alert("iterator1和iterator2不相等")
}

var iterator1 = Iterator([1,2,3])
var iterator2 = Iterator([2,2,3])
compare(iterator1, iterator2) //throw new Error("iterator1和iterator2不相等")
中止迭代器
迭代器可以像普通for循环中的break一样，提供出一种跳出循环的方法
var each = function(ary, callback){
    for(let i = 0, l=ary.length; i3){
        return false
    }
    console.log(n) //输出1，2，3
})
总结
迭代器模式是一种相对简单的模式，简单到很多时候我们都不认为它是一种设计模式。目前绝大部分都内置了迭代器

超融合服务器 idc机房托管迭代器模式 javascript设计模式装饰器模式 javascript命令模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108678.html

ES6 Features系列：GeneratorFunction介绍

摘要：没有显示显示显示关键字迭代器生成器用于马上退出代码块并保留现场，当执行迭代器的函数时，则能从退出点恢复现场并继续执行下去。迭代器迭代器是一个拥有方法和方法的对象，通过函数不断执行以关键字分割的代码段，通过函数令分割的代码段抛出异常。一、前言　　　　　　　　　　　　　　　　　　　　　　　　　　　第一次看koajs的示例时，发现该语句 function *(next){..........

golden_hamster 2019-08-21 10:36 评论0 收藏0
JS迭代器模式《JavaScript设计模式与开发实践》阅读笔记

摘要：但实际中，内部迭代器和外部迭代器两者并无优劣。迭代器并不只迭代数组迭代器模式不仅能迭代数组，还可以迭代一些类数组对象。晚安了，参考设计模式与开发实践曾探本文作者本文链接迭代器模式设计模式与开发实践阅读笔记迭代器模式：一个相对简单的模式，目前绝大多数语言都内置了迭代器，以至于大家都不觉得这是一种设计模式迭代器模式迭代器模式指提供一种方法访问一个聚合对象中的各个元素，而又不需要暴露该...

djfml 2019-08-23 10:43 评论0 收藏0
JS 异步编程六种方案

摘要：接下来介绍下异步编程六种方法。六生成器函数是提供的一种异步编程解决方案，语法行为与传统函数完全不同，最大的特点就是可以控制函数的执行。参考文章前端面试之道异步编程的种方法你不知道的中卷函数的含义和用法替代的个理由前言我们知道Javascript语言的执行环境是单线程。也就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务。这种模式虽然实现起...

longmon 2019-08-23 14:42 评论0 收藏0
JavaScript 设计模式（五）：迭代器模式

摘要：文章内容分两部分前半部分为迭代器模式概念后半部分为中迭代器上半部分开始迭代器模式提供一种方法顺序访问一个聚合对象中的各个元素，而又不需要暴露该对象的内部表示。下半部分开始的迭代器迭代器等同于遍历器。执行该函数，会返回一个遍历器对象。 showImg(https://segmentfault.com/img/bVbuyaZ?w=800&h=600); 文章内容分两部分：前半部分为迭...

zhou_you 2019-08-23 18:26 评论0 收藏0
JavaScript iterator 设计模式

摘要：迭代器模式就是按照顺序访问一个对象中元素，而不用暴露该对象的内部组成。迭代器模式就是将这个迭代实现从业务中分离出来。外部迭代器外部迭代器必须显式地请求才会迭代下一个元素。迭代器模式就是按照顺序访问一个对象中元素，而不用暴露该对象的内部组成。迭代器模式就是将这个迭代实现从业务中分离出来。但实际开发中我们并不将他当成一个设计模式。前瞻后顾说起迭代器，想必对ES6有了解的同学应该不会...

CocoaChina 2019-08-22 13:59 评论0 收藏0