这种异常行为是由 Javascript 异步运行引起的吗？

Question

  Snake.prototype.move = function() {
    var head = this.head();
    var newCoord = new Coord(head.pos);

    console.log(head, newCoord);
    console.log(head.pos, newCoord.pos);

    this.segments.push(newCoord);
    head.plus(this.dir);

    if (this.growingCount > 0) {
      this.growingCount -= 1;
    } else {
      this.segments.pop();
    }
  };

Coord() 构造函数和plus 函数：

var Coord = SnakeGame.Coord = function(pos) {
    this.pos = pos;
  };

  Coord.prototype.plus = function(dir) {
    if (dir === "U") {
      this.pos[0] -= 1;
    } else if (dir === "D") {
      this.pos[0] += 1;
    } else if (dir === "R") {
      this.pos[1] += 1;
    } else if (dir === "L") {
      this.pos[1] -= 1;
    }
  };

head() 返回Snake 实例的segments 属性中的第一段。

我看到的问题是两个console.log 似乎显示不同的结果。第一行显示了 pos 值为 [3, 2] 的 Coord 对象（这不应该是这种情况，因为 head 尚未更新）。下一个 console 行，输出 [3, 3] 和 [3, 3] （应该是这种情况）。

发生了什么事？我觉得错误正盯着我看，我看不到它。

澄清：基本上head 和newCoord 在首次实例化时具有相同的位置（不变）。在head.plus(this.dir); 行之后，head 应该比newCoord 多一个位置。

该方法的一个执行应该有head.pos 是[3, 2] 和newCoord 有[3, 3]。下一次执行，head.pos 应该是 [3, 1]，另一个 newCoord 应该是 [3, 2]。这有意义吗？

Answer 1

console.log 可以是异步的。看看：

• JavaScript console prints assigned value of variable before it has been assigned?
• console.log() async or sync?

所以，在行中

console.log(head, newCoord);

您正在传递对head 的引用。在评估参考以打印其位置时，该位置已更改。在另一行中，改为：

console.log(head.pos, newCoord.pos);

您正在传递对当前存储在head.pos 的对象的引用。然后您可以为head.pos 分配另一个值，但console.log 触发的进程（可能会在此之后发生）仍将具有对原始对象的引用，因此它实际上会打印当时的位置值console.log 时间到了。