通过循环同步运行代码

时间:2018-01-22 12:02:37

标签: javascript synchronization

我希望与循环中的某些等待同步执行我的代码。 第一个,在onCreate函数()上,每个循环将每3秒执行一次。

比onInflate()函数在onCreate函数完成后执行。

我在SO上阅读了很多问题。我确实喜欢这个代码

var onCreate = function(){ 
    var deferred = new $.Deferred();

    for(var i = 0; i < TOTAL_FRAME; i++){
        scene.set(i, {iFrame : "#iviFrame" + (i+1)} ); 

        $(scene.get(i).iFrame).attr("src", buffer.get(i).url); 
        // Wait for 3 second every loop
    } 
    deferred.resolve("done");                
    return deferred.promise();  
}

然后等待onCreate功能完成

onCreate().done(function(){
    onInflate();   

    console.log("XXX2"); 
}); 

我已经尝试过这个代码,但是没有用。

var onCreate = function(){ 
    var deferred = new $.Deferred();

    setTimeout(function () {
        scene.set(x, {iFrame : "#iviFrame" + (x+1)} );
        $(scene.get(x).iFrame).attr("src", buffer.get(x).url); 
        x++;   

        setTimeout(function () {
            console.log("XXX1B");
            scene.set(x, {iFrame : "#iviFrame" + (x+1)} );
            $(scene.get(x).iFrame).attr("src", buffer.get(x).url); 

            deferred.resolve("done");                
            return deferred.promise();                        
        }, 3000);
    }, 3000);

    deferred.resolve("done");                
    return deferred.promise();  
}

流程应为
- onCreate(){
- - 循环
- - 任务x
== ==等待3S
- - 结束循环
- }

- onInflate()

如何与某些等待同步运行?

1 个答案:

答案 0 :(得分:0)

我建议使用标准承诺并一般阅读Promises and Callbacks

var onCreate = function() {
  var deferred = new Promise(function(resolve, reject) {
    var computations = 0;

    function compute() {
      var d = Date.now();
      //do 1/60 of a second worth of calculations
      while (Date.now() - d < 16) {
        computations++;
      }
    }
    //Wait 3 seconds
    setTimeout(function() {
      console.log("TIMEOUT EXPIRED");
      //Do some computation
      compute();
      //Resolve promise
      resolve(computations);
    }, 3000);
  });
  return deferred;
};
//TEST
console.log("START");
onCreate().then((function(computations) {
  console.log("Hey there.\nSo.. i just did " + computations + " calculations and i was wondering..\nDid i do a good job? O_o");
}));
console.log("END");

编辑1 - 异步承诺模式

对于异步Promises,定义一个计算函数(“timeoutOperation”),它对某些条件进行一些计算和测试。如果满足条件,则解决promise,否则,调用自身执行另一次计算。

以下是此模式的示例,它描述了异步for...loop模式:

var onCreate = function() {
  var deferred = new Promise(function(resolve, reject) {
    var timeoutTime = 100;
    var computations = 30;
    var i = 0;
    //Operation to handle computation and set new timeouts until condition met
    function timeoutOperation() {
      console.log("TIMEOUT " + i + " EXPIRED");
      //Do some computation
      /* COMPUTATION HERE */
      //Append i and test
      i++;
      if (i < computations) {
        setTimeout(timeoutOperation, timeoutTime);
      } else {
        //Resolve promise
        resolve("Some return value");
      }
    }
    setTimeout(timeoutOperation, timeoutTime);
  });
  return deferred;
};
//TEST
console.log("START");
onCreate().then((function(return_value) {
  console.log(return_value);
}));
console.log("END");

为了示例,我将循环量降低到30(“计算”)并将延迟降低到100(“timeoutTime”)。