如何创建一个对象作为在Javascript默认值的多维数组？

Question

我有，当我想创建一个多维数组的麻烦。

我不知道为什么，但我得到一个奇怪的现象，当我想创建一个对象作为默认值的多维数组。

我使用了不同的方法，如：

• https://stackoverflow.com/a/41435124/1741027
• https://stackoverflow.com/a/28625612/1741027
• https://stackoverflow.com/a/18116922/1741027

当我想要改变对象的领域中的任何一个出现麻烦。

function matrix(rows, cols, defaultValue){ 
 
    var arr = []; 
 
    // Creates all lines: 
 
    for(var i=0; i < rows; i++){ 
 
     // Creates an empty line 
 
     arr.push([]); 
 
     // Adds cols to the empty line: 
 
     arr[i].push(new Array(cols)); 
 
     for(var j=0; j < cols; j++){ 
 
     // Initializes: 
 
     arr[i][j] = defaultValue; 
 
     } 
 
    } 
 
\t return arr; 
 
} 
 

 
var myArray = matrix(5, 5, { 
 
\t status: 'OK' 
 
}); 
 

 

 
myArray[2][1].status = 'NOT OK'; 
 

 
console.log('Strange behavior', myArray);

的变化而膨胀的其他位置。

任何人都可以帮助我吗？

Answer 1

因为你存储一个参考，对同一对象一遍又一遍，你，你有描述的行为。要获得单独的对象，你可以使用object.assign，每次做的一（浅）拷贝默认值你需要它：

arr[i][j] = Object.assign({}, defaultValue); 

与世界其他一些ES6功能，你的代码看起来是这样的：

function matrix(rows, cols, defaultValue){ 
 
    return Array.from(Array(rows), 
 
    row => Array.from(Array(cols), cell => Object.assign({}, defaultValue)) 
 
); 
 
} 
 
var myArray = matrix(5, 5, { 
 
\t status: 'OK' 
 
}); 
 

 
myArray[2][1].status = 'NOT OK'; 
 

 
console.log('Correct behavior', myArray);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

而不是

arr.push([]); 
// Adds cols to the empty line: 
arr[i].push(new Array(cols)); 

尝试

arr.push(new Array(cols)); 

Answer 3

的问题是你在矩阵中的每个点分配相同的对象。所以如果你在数组中的某一点改变对象，它也会在其他所有点上改变。要修复，使用克隆函数（如下划线或jQuery）或为矩阵中的每个点实例化一个新对象。

Answer 4

对象由它们的引用传来传去，所以你在矩阵中分配给所有单元设置成相同对象的引用从而使他们都是同一个对象（改变一个也会导致其他人也改变）。你必须复制对象。如果您使用的是最近的ECMAScript，您可以使用Object.assign，如下所示：

function matrix(rows, cols, defaultValue) { 
    var arr = []; 
    for(var i=0; i < rows; i++) { 
     var row = []; // create a row 
     arr.push(row); // push it into the matrix 

     for(var j=0; j < cols; j++) { 
     row[j] = Object.assign({}, defaultValue); // copy the default value and assign it to this cell 
     } 
    } 
    return arr; 
}