JavaScript 設計模式(六) 迭代器模式

時間 2019-11-07

原文原文鏈接

迭代器模式指提供一種方法順序訪問一個聚合對象中的各個元素，而不須要暴露對象的內部。迭代器模式能夠把迭代的過程從業務邏輯中分離出來，在使用迭代器模式後，即便不關心內部構造，也能夠按順序訪問其餘的每一個元素。

jquery中的迭代器

迭代器模式無非就是循環訪問聚合對象中的各個元素。好比jquery中的each函數。jquery

$.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<l;i++) {
        callback.call(ary[i], i, ary[i])
    }
}
each([1,2,3], function(i, n){
    alert([i,n])
})

假如如今有個需求，要判斷2個數組裏的值是否徹底相等，若是不改寫each裏的代碼，那麼入手的就只能是each的回調函數了函數

var each = function(ary, callback){
    for(let i = 0, l=ary.length; i<l;i++) {
        callback.call(ary[i], i, ary[i])
    }
}
each([1,2,3], function(i, n){
    alert([i,n])
})
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不相等')
        }
    })
    alear('ary1和ary2相等')
}
compare([1,2,3],[1,3,4]) //throw new Error('ary1和ary2不相等')

外部迭代器

外部迭代器必須顯示的請求迭代下一個元素設計

優勢：加強了迭代器的靈活性,能夠手工控制迭代的過程或者順序 code

缺點：增長了調用的複雜度對象

下面用外部迭代器改寫上面那個需求get

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; i<l;i++) {
        // 若是回調函數返回false，則停止循環
        if(callback(i, ary[i]) === false) {
            break
        }
    }
}
each([1,2,3,4], function(i, n){
    if(n>3){
        return false
    }
    console.log(n) //輸出1，2，3
})