JS迭代器形式《JavaScript设想形式与开辟实践》浏览笔记

迭代器形式:一个相对简朴的形式,现在绝大多数言语都内置了迭代器,以至于人人都不以为这是一种设想形式

迭代器形式

迭代器形式指供应一种要领接见一个聚合对象中的各个元素,而又不须要暴露该对象的内部示意

个人明白成遍历聚合对象中的各个(某些)元素,并实行一个回调要领,现在大多数言语都已内置了迭代器,但这里纪录一下,明白个中的完成目标。

jQuery 中的$.each

$.each([1,2,3,4,5], function(i, el) {
    console.log('index: ',i)
    console.log('item: ', el)
})

怎样自定义一个each函数,完成以上的结果呢?

var each = function (arr, callback) {
    for (var i = 0, len = arr.length; i<len; i++) {
        callback.call(arr[i], i, arr[i])
    }
}

each([1,2,3,4,5], function(i, el) {
    console.log('index: ',i)
    console.log('item: ', el)
})

这里完成了一个较为简朴的内部迭代器要领,但是迭代器同时另有一种相似——外部迭代器

内部迭代器和外部迭代器

内部迭代器

如方才自定义个each要领,这类迭代器在内部已定义好了迭代划定规矩,如,迭代的方向,迭代是不是在满足前提是中断。

内部迭代器在挪用时异常轻易,外界不用去体贴其内部的完成。在每一次挪用时,迭代器的划定规矩就已制订,假如碰到一些不一样的迭代划定规矩,此时的内部迭代器并不很文雅

like this:

// 当须要同时迭代两个数组时

var compare = function(ary1, ary2) {
    if (ary1.length !== ary2.length) {
        throw new Error ('ary1 和 ary2 不相称')
    }
    
    each(ary1, function(i, n){
        if (n !== ary2[i]) {
            throw new Error ('ary1 和 ary2 不相称')
        }
    })
    alert ('ary1, ary2相称')
}

compare([1,2,3,4], [2,3,4,5,6])

但假如用外部迭代器来完成一个如许的需求时,就显得越发清楚易懂

外部迭代器

外部迭代器必需显现地要求迭代下一个元素(ltertor.next())

外部迭代器虽然增加了挪用的复杂度,但增强了迭代器的灵活性,我们能够手工掌握迭代历程或许递次。Generators 应当就是一种外部迭代器的完成。那末接下来看看怎样本身完成一个外部迭代器:

var Iterator = function(obj) {
    var current = 0
    var next = function() {
        current += 1
    }
    var isDone = function() {
        return current >= obj.lenght
    }
    var getCurrent = function() {
        return obj[current]
    }
    return {
        next: next,
        length: obj.length,
        isDone:isDone,
        getCurrent:getCurrent
    }
}

经由过程这个迭代器,我们就能够越发文雅的完成方才的compare要领来迭代两个数组了:

var compare = function(iteraotr1, iteraotr2) {
    if (iteraotr1.length !== iteraotr2.length) {
        alert('不相称')
    }
    //外部设定前提来决议迭代器的举行
    while (!iteraotr1.isDone() && !iteraotr2.isDone()) {
        if (iteraotr1.getCurrent() !== iteraotr2.getCurrent()) {
            alert('不相称')
        }
        iteraotr1.next()
        iteraotr2.next()
    }
    alert('相称')
}

var iteraotr1 = Iterator([1,2,3])
var iteraotr2 = Iterator([1,2,3])

compare(iteraotr1,iteraotr2) // 相称

经由过程外部迭代器,较为文雅的完成了这个同时迭代两个数组的需求。但现实中,内部迭代器和外部迭代器二者并没有好坏。详细运用何种,需更具现实情况来决议。

迭代器并不只迭代数组

迭代器形式不仅能迭代数组,还能够迭代一些类数组对象。比方arguments{a:1,n:2,c:3}等。其须具有的就是对象具有一个length属性能够接见,并能经由过程下标来接见对象中的各个元素。

个中for ... of 能够来轮回数组,对象字面量则能够经由过程for ... in来接见个中的各个属性的值来到达目标。

迭代器能够中断

在for轮回中,我们能够经由过程break来跳出轮回,所以在迭代器形式中。我们能够应用这个来提早停止迭代。接下来我们改在一下最最先的each函数

var each = function(arr, callback) {
    var result
    for (var i = 0, len = arr.length; i < len; i++) {
        result = callback.call(arr[i], i, arr[i])
        if (result === false) {
            break
        }
    }
}

each([1,2,3,4,5,6,7], function(i, el) {
    if (el > 3) {
        return false
    }
    console.log(el)
})

末了

迭代器形式的完成道理较为简朴,JavaScript中有更多针对差别需求的迭代器完成。我们也能够本身定义一个合适的划定规矩来处置惩罚数组,类数组如许的对象。但每每最罕见的也是最轻易被忽视的,而一个罕见的东西每每是更好用更受用的。

晚安了,skr skr skr

参考

《JavaScript设想形式与开辟实践》—— 曾探

本文作者: Roy Luo

本文链接: JS迭代器形式《JavaScript设想形式与开辟实践》浏览笔记

    原文作者:罗高
    原文地址: https://segmentfault.com/a/1190000015894834
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞