CODEWITHSUNDEEP
javascriptarrays
Henry
Henry

Reputation: 118

Javascript array in array - first index is always overwritten

I have a problem with my JS function. For simplification, I want to fill an array (arr1) with n other arrays (arr2). In my loop I use a counter for the current postion in arr1 (cant use arr1.push for a reason). If I log all my arr2's in arr1 they are all the same, always the last one that was added. So I wrote a basic script to test it. I always log the first element and incement the counter. I'm new to JS, is there some huge misunderstanding I don't get?

function test(){
	var arr1 = [];
	var arr2 = [];
	var counter=1;
	arr2[0]="first";
	arr2[1]="first";
	arr2[2]="first";
	arr1[0]=arr2;
  arr1[0].forEach(function(elem){console.log(elem);});
	for (var i = 0; i < 10 ; i++) {
		arr2[0]=counter;
		arr2[1]=counter;
		arr2[2]=counter;
		arr1[counter]=arr2;
    
		arr1[0].forEach(function(elem){console.log(elem);});
		counter++;
	}
}
<button onclick="test()">Click</button>

Upvotes: 1

Views: 244

Answers (2)

Wolfyr
Wolfyr

Reputation: 479

You can try to use the spread operator.

arr1[0]=[...arr2];
arr1[counter]=[...arr2];

An array is a reference type, so you always refer to the base, you don't put a copy of it inside of arr1 but a reference to the arr2.

You want a copy of arr2 to be assigned to arr1.

You can do this by creating a new Array, or more modern the ... spread operator

Upvotes: 1

Henry
Henry

Reputation: 118

As Pointy said it, it just referenced the arr2 and doesn't create a copy.

So you need to 

arr2=new Array();

at the beginning of the loop.

Upvotes: 0

Related Questions