理解基本的javascript逻辑

时间:2017-03-05 05:24:40

标签: javascript jquery logic

我目前正在学习/练习DOM操作,并浏览了本教程/练习表。

https://github.com/lmuntaner/dom_manipulation

我目前对createGrid函数创建的循环感到困惑。 ...功能" createGrid"是创建并参与。该函数创建一个for循环,其中包含另一个嵌套在其中的循环...它具有与第一个完全相同的语句...为什么要创建一个单独的循环?为什么不只有一个for循环?有人能解释一下这个吗? (编写此代码的人远远超出了我,但我仍然想了解原因)

    $(function () {
  var rows = 10;
  var cols = 10;
  var cells = [];
  function createGrid(root) {
    for(var i = 0; i < cols; i++) {
      for(var j = 0; j < cols; j++) {
        var cell = $('<div>').addClass('cell');
        cells.push(cell);
        root.append(cell);
      }
    }
  };

  var updateState = function() {
    cells.forEach(function (cell) {
      var randomNum = Math.random() * 2;
      if (randomNum > 1) {
        cell.addClass('active');
      } else {
        cell.removeClass('active');
      }
    });
  }

  setInterval(updateState, 500);

  var $root = $('.container');
  createGrid($root);
});

1 个答案:

答案 0 :(得分:4)

嗯,实际上我很确定这是开发人员的错误。如你所想,这没有意义。 只需像这样更改父循环:

function createGrid(root) {
    for(var i = 0; i < rows; i++) {
        for(var j = 0; j < cols; j++) {
            var cell = $('<div>').addClass('cell');
            cells.push(cell);
            root.append(cell);
        }
    }
}

因为创建表或网格的常用方法是使用父循环创建行,并使用嵌套循环创建列。 他只是没有意识到他的错误。