Как установить задержку в одну секунду между итерациями? - PullRequest
Новая
       1

Как установить задержку в одну секунду между итерациями?

0 голосов
/ 05 ноября 2011 
var arr = [[1,2,3],[4,5,6],[7,8,9]];


function out(ar){

  var interval = setInterval(function(){
    for (var i=0; i<ar.length;i++){

      for (var j=0;j<ar[i].length;j++){

        document.write(ar[i][j]);

      }
    document.write("</br>");
    }
  clearInterval(interval);
  },1000);

}

out(arr);

http://jsbin.com/edanib/edit

Этот код работает, но я хотел бы сделать одну секунду задержки перед выводом каждого числа. Приведенный выше код не может этого сделать. Как мне сделать это в ванили Javascript?

Ответы [ 3 ]

1 голос
/ 05 ноября 2011

setInterval не гарантирует, что вы получите интервал в 1 секунду, потому что другие вещи могут работать, но вы можете приблизиться со следующим 

function out(ar) {
  var i = 0, j = 0;
  var interval = setInterval(function(){
    // Start with the next row if the last one was finished.
    if (i < ar.length && j == ar[i].length) {
      ++i; 
      j = 0;
      // Put a line after it.
      document.body.appendChild(document.createElement('br'));
    }
    // Check if we're out of rows.
    if (i >= ar.length) { clearInterval(interval); return; }

    // Write out a number.
    document.body.appendChild(document.createTextNode('' + ar[i][j]));

    // We're done with the cell that we just wrote.
    ++j;
  }, 1000 /* milliseconds */);
}

Поместите индексы массива вне функции, поэтому каждый раз, когда срабатывает интервал, он получает состояние цикла из последнего запуска.

Кроме того, вы не можете использовать document.write в обработчике интервалов, потому что вызов document.write после того, как документ закрыт, забивает существующий документ.

0 голосов
/ 05 ноября 2011

попробуйте так: сначала создайте одномерный массив, который вы дадите выходной функции, которая вызывает себя с задержкой: 

var arr = [[1,2,3],[4,5,6],[7,8,9]];


function out(ar){
    var singleDim = []
    for (var i=0; i<ar.length;i++){

      for (var j=0;j<ar[i].length;j++){

          singleDim.push(ar[i][j]);

      }
    }
    outDelayed(singleDim,0,1000);
}

function outDelayed(arr,index,delay) {
    if (index < arr.length) {
        document.write(arr[index]);
        setTimeout(function(){
            outDelay(arr,index+1,delay);
        },delay);
    }
}

out(arr);
0 голосов
/ 05 ноября 2011

Самый простой способ сделать это - создать цикл с setInterval. Пусть функция захватывает счетчики и увеличивает их на каждом ходу

Попробуйте следующее 

function output(arr) {
  var i = 0; 
  var j = 0;
  var interval = setInterval(function () { 

    while (i < arr.length && j === arr[i].length) {
      j = 0;
      i++;
    }

    if (i === arr.length) {
      clearInterval(interval);
    } else {
      document.write(arr[i][j]);
    }
    j++;
  }, 1000);
};
...