簡體   English   中英

如何使用基於回調的循環的yield?

[英]How to use yield with callback based loops?

雖然yield關鍵字的主要目的是為某些數據提供迭代器,但使用它來創建異步循環也相當方便:

function* bigLoop() {
    // Some nested loops
    for( ... ) {
        for( ... ) {
            // Yields current progress, eg. when parsing file
            // or processing an image                        
            yield percentCompleted;
        }
    }
}

然后可以異步調用它:

function big_loop_async(delay) {
    var iterator = big_loop();
    function doNext() {
        var next = iterator.next();
        var percent_done = next.done?100:next.value;
        console.log(percent_done, " % done.");
        // start next iteration after delay, allowing other events to be processed
        if(!next.done)
            setTimeout(doNext, delay);
    }
    setTimeout(doNext, delay);
}

但是,在現代javascript中,基於回調的循環已經變得非常流行。 我們有Array.prototype.forEachArray.prototype.findArray.prototype.sort 所有這些都基於每次迭代傳遞的回調。 我甚至聽說建議我們盡可能使用這些,因為它們可以比循環的標准更好地進行優化。

我還經常使用基於回調的循環來抽象出一些復雜的循環模式。

這里的問題是,是否有可能將這些轉化為基於yield的迭代器? 舉個簡單的例子,我想讓你以異步方式對數組進行排序。

tl;博士:你不能這樣做,但看看你可以用最新的V8和藍鳥做的其他事情:

 async function asyncReduce() { const sum = await Promise.reduce( [1, 2, 3, 4, 5], async (m, n) => m + await Promise.delay(200, n), 0 ); console.log(sum); } 

不,不可能使Array.prototype.sort從其比較函數異步接受比較結果; 你必須完全重新實現它。 對於其他個別情況,可能存在黑客攻擊,例如一個coroutiney forEach (它甚至不一定像你期望的那樣工作,因為每個發生器將在yield繼續之前運行直到它的第一個yield ):

function syncForEach() {
    [1, 2, 3, 4, 5].forEach(function (x) {
        console.log(x);
    });
}
function delayed(x) {
    return new Promise(resolve => {
        setTimeout(() => resolve(x), Math.random() * 1000 | 0);
    });
}

function* chain(iterators) {
    for (const it of iterators) {
        yield* it;
    }
}

function* asyncForEach() {
    yield* chain(
        [1, 2, 3, 4, 5].map(function* (x) {
            console.log(yield delayed(x));
        })
    );
}

並且reduce ,它本質上很好地工作(直到你看性能):

function syncReduce() {
    const sum = [1, 2, 3, 4, 5].reduce(function (m, n) {
        return m + n;
    }, 0);

    console.log(sum);
}
function* asyncReduce() {
    const sum = yield* [1, 2, 3, 4, 5].reduce(function* (m, n) {
        return (yield* m) + (yield delayed(n));
    }, function* () { return 0; }());

    console.log(sum);
}

但是,沒有魔杖適用於所有功能。

理想情況下,您需要為所有這些函數添加備用的基於promise的實現 - 流行的promise庫,比如bluebird,已經為mapreduce執行此操作,例如 - 並使用async / await而不是generator(因為async函數返回promises):

async function asyncReduce() {
    const sum = await Promise.reduce(
        [1, 2, 3, 4, 5],
        async (m, n) => m + await delayed(n),
        0
    );

    console.log(sum);
}

如果ECMAScript具有像Python這樣的理智裝飾器,你就不需要等待async支持來做這么多:

@Promise.coroutine
function* add(m, n) {
    return m + (yield delayed(n));
}

@Promise.coroutine
function* asyncReduce() {
    const sum = yield Promise.reduce([1, 2, 3, 4, 5], add, 0);

    console.log(sum);
}

......但事實並非如此。 或者你可以使用這樣的代碼:

const asyncReduce = Promise.coroutine(function* () {
    const sum = yield Promise.reduce([1, 2, 3, 4, 5], Promise.coroutine(function* (m, n) {
        return m + (yield delayed(n));
    }), 0);

    console.log(sum);
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM