传递的对象置于阵列

Question

var initGrid = function() { 
 

 
    //creating a grid while initialising it 
 
    var grid = []; 
 

 
    // declaring each grid element as a Object having three properties 
 
    var gridElement = { 
 
    x: Number, 
 
    y: Number, 
 
    val: Number 
 
    }; 
 

 
    for (var i = 0; i < 10; i++) { 
 
    for (var j = 0; j < 10; j++) { 
 
     gridElement.x = i; 
 
     gridElement.y = j; 
 
     gridElement.val = 0; 
 
     grid.push(gridElement); 
 
    }; 
 
    }; 
 

 
    return grid; 
 
}; 
 

 
console.log(initGrid());

当我运行在控制台上此代码，网格阵列的所有对象被具有用于x和y它们是相同的值9,9 ....

但是我想创建具有不同循环变量值的对象

Answer 1

这是因为Object通过引用传递。您将不得不在每次迭代中创建不同的对象。

以下是样本。

var initGrid = function() { 
 

 
    //creating a grid while initialising it 
 
    var grid = []; 
 

 
    for (var i = 0; i < 10; i++) { 
 
    for (var j = 0; j < 10; j++) { 
 
     var gridElement = {} 
 
     gridElement.x = i; 
 
     gridElement.y = j; 
 
     gridElement.val = 0; 
 
     grid.push(gridElement); 
 
    }; 
 
    }; 
 

 
    return grid; 
 
}; 
 

 
console.log(initGrid());

Answer 2

你不声明gridElement键入方式; Javascript不会那么做，Typescript会（但那不是重点）。

你看到相同的值，因为你永远只能有一个gridElement对象，你

var gridElement = { 
    x: Number, 
    y: Number, 
    val: Number 
}; 

其中，上下文，初始化与性能x，y对象创建的，并val都指向Number构造函数。

每次循环都在变异此相同的对象，并推到您的网格，以一个对象的引用，这样你就不会真正有x和100个网格元素y等于9 - 你有100个引用相同对象，您写入x和y的最后一个值都是9。

举个例子，你可以创建如下每个循环新的对象：

for (var i = 0; i < 10; i++) { 
    for (var j = 0; j < 10; j++) { 
    var newGridElement = { 
     x: i, 
     y: j, 
     val: 0 
    }; 
    grid.push(newGridElement); 
    console.log(newGridElement); 
    }; 
}; 

您可以声明自己的GridElement构造函数和类型，但如果你真的很需要那，你会做像你自己的defining a Javascript class。

Answer 3

您可以使用用户定义的对象，其功能和实例为new运算符[MDN]。这为数据结构提供了一个接口。

var initGrid = function() { 
 
    var grid = []; 
 

 
    function GridElement(x, y, val) {   // user-defined function 
 
     this.x = x;        // properties 
 
     this.y = y; 
 
     this.val = val; 
 
    }; 
 

 
    for (var i = 0; i < 10; i++) { 
 
     for (var j = 0; j < 10; j++) { 
 
      grid.push(new GridElement(i, j, 0)); // use an instance of GridElement with new 
 
     }; 
 
    }; 
 

 
    return grid; 
 
}; 
 

 
document.write('<pre>' + JSON.stringify(initGrid(), 0, 4) + '</pre>');