在后台運行While循環

Question

我有一個基於javascript的Angular應用程序，在用戶按下按鈕后會運行while循環，然后運行循環直到我們獲得一定的數字，然后循環結束。 當前，當循環運行時，無法在UI上執行任何其他操作，有沒有辦法將此循環推到后台，以便用戶可以在UI上繼續執行其他操作。

Answer 1

為此請使用角度觀察器：

$rootscope.watch(myParam, function () {});

或使用非阻塞setInterval() ：

var timer = setInterval(function () {
    if (myParam == 'what-i-need') {
        clearInterval(timer);
    }
}, 200);

Answer 2

您可以使用webworker，作為下面的示例代碼（該代碼雖然不能完全正常運行，但只是為了給您一個想法。

(
function () {
    var scope = self;
    var condition = false

    scope.addEventListener('message', function (event) {
        var caller = event.data;
        if(caller.name && caller.command && caller.command === 'TERMINATE'){
            return;
        }              
        start(caller);
    }, false);

    function start(){
        while (condition) {
            if(condition)
                scope.postMessage({result:"result"});                

        }
    }

})();

在您的angularjs控制器或服務中

if (!worker) {
                    worker = new $window.Worker("./online-capability-worker.js");
                    worker.addEventListener('message', onResponse, false);
                }
function onResponse(event) {
            var response = event.data;
            //This is my nuber returned by worker
        }

Answer 3

Javascript是同步的，而事件驅動系統允許它模仿異步語言，而您的代碼仍在單個線程上運行。 您可以使用setTimeout來遞歸地調用函數，而不是使用while循環，這樣一來，線程就有時間在每次迭代之間執行其他操作。

function incrementNumber(initial, destination){
    if(initial < destination){
        setTimeout(function(){incrementNumber(initial+1, destination}), 10);
    }else{
        alert('We found the number!');
    }
}

我想指出的是，我同意將setInterval用於更改數字之類的簡單操作，但是在瀏覽器中（據我所知），該間隔從回調最初被調用時開始，如果回調本身具有大量執行時間（例如ajax調用），則可能導致意外結果。