JS 多維 Arrays - 如何讓 .push() function 正常工作

Question

以下代碼示例是我在互聯網上找到的

arr[1].push('native', 'laravel');

帶有描述

這里我們使用 javascript 數組推送方法向內部子數組添加兩個新元素（項）。

這正是我想要完成的！

但是當我自己嘗試了幾次時，它總是這樣：

 let mainArr = []; console.log("mainArr: ", mainArr); // Working as expected: created an empty array let emptyArr = []; console.log("emptyArr: ", emptyArr); // Working as expected: created an empty array for (i = 0; i < 3; i++) { mainArr.push(emptyArr); } console.log("mainArr: ", mainArr); // Working as expected: pushed 3 times the "emptyArr" into "mainArr" let newArr = [["X"], [90]]; mainArr[0].push(newArr); console.log("mainArr[0]: ", mainArr[0]); console.log("mainArr[1]: ", mainArr[1]); console.log("mainArr[2]: ", mainArr[2]); // NOT working as expected: pushed "newArr" into every of the three arrays within the "mainArr"?!! // How can I solve this?

很想聽聽一些提示：）

謝謝！

Answer 1

那是因為 arrays 是 JS 中的對象，即非原始類型的變量。

長解釋

Javascript 有 5 種按值傳遞的數據類型：Boolean、String、Number、null 和 undefined。 這些被稱為原始類型。

它有 3 種通過引用傳遞的數據類型：數組、Function 和 Object。 這些都是技術上的對象。

當您將非原始值分配給變量時，會發生對該值的引用，而不是實際值。 即，該引用指向對象在 memory 中的位置。 變量實際上並不包含值。

在你的情況下

當您按emptyArr 3 次時，您不會插入值（即新的空數組），而是插入與 emptyArr 相同的emptyArr引用。 這 3 個引用指向 memory 中具有空數組值的相同位置。 鑒於此，現在您將newArr插入到mainArr[0]的引用值，但 rest 元素mainArr[1] 、 mainArr[2]是指向與mainArr[0]指向的值相同的值的引用。

希望這是有道理的。

否則，您可以參考這里https://stackoverflow.com/a/430958/4700560或者我也發現這篇文章非常具有視覺描述性和幫助https://blog.penjee.com/passing-by-value-vs-by參考-java-圖形