将对象传递到数组中

passing Object into Array

本文关键字：数组 对象      更新时间：2023-09-26

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。

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

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

下面是示例。

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());

你不是这样声明 gridElement 类型;Javascript不会这样做，Typescript会(但这无关紧要(。

您

会看到相同的值，因为您只有一个 gridElement 对象，即您创建的那个对象

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

对于上下文，它初始化一个对象，其属性 x、y 和 val 都指向 Number 构造函数。

每次循环迭代都会改变同一个对象，并将对该对象的引用推送到网格上，因此您实际上没有 100 个 x 和 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构造函数和你自己的类型，但如果你真的需要它，你将做一些事情，比如定义你自己的Javascript类。

您可以使用用户定义的对象，带有函数和带有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>');

相关文章：