Динамически создаваемый массив всегда заполнен переменными

Question

Почему зарегистрированный массив всегда заполнен данными? Разве это не должен быть массив, содержащий только один, два, а затем три массива?

var theArray=[];
function insertValues(species,quantity){
    var w = window;
    w[species]= [];
        for(let i =0; i<quantity;i++){
            w[species].push({
                species:species,
                randomValue:Math.random()*10
                })
                // console.log(theArray);
        }

    theArray.push(w[species]);
}

var listOfSpecies =[{animal:"Fish",amount:5},{animal:"Shark",amount:5},{animal:"Algae",amount:5}];

for(let i = 0; i<listOfSpecies.length; i++){
    console.log(theArray);

    insertValues(listOfSpecies[i].animal,listOfSpecies[i].amount);
}

Answer 1

Ого! Во-первых, не назначайте окно! (неожиданные вещи почти наверняка произойдут).

Кроме того, объекты JavaScript (да, массив является объектом, typeof [] === "object" // true) передаются по ссылке, а не по значению.

Когда вы добавляете к theArray, создается новая ссылка. Когда вы заходите в консоль, он сначала показывает пустой массив , но на самом деле он записал ссылку на theArray, поэтому при просмотре содержимого он показывает массив. заполнены значениями;

Даже попробуйте приведенный ниже пример, происходит то же самое (хотя гораздо проще следовать)

var arr = [];
for (var idx = 0; idx < 3; idx++) {
    console.log(arr);
    arr[idx] = idx;
}

, чтобы предотвратить это, вам нужно скопировать массив, например так:

var newArray = Object.assign([], theArray);

Object.assign копирует значения массива (или объекта), возвращая новый массив (снова или объект), но не создает ссылку обратно на исходный массив или объект.