JavaScript Arrays .push() not working as Expected

Question

I'm writing this JavaScript code expecting the output as

[["o","o","x","o","o"],["o","x","x","x","o"]]

but instead it gives

<script>
function createArray(x) {
  var array=[];
  var finalArray=[];
  
  for(var i=1;i<=x;i++){
    array[i-1]='O';
  }

  var midIndex=Math.round(x/2)-1;
  
  array[midIndex]='X';


  finalArray.push(array);

  var num1=midIndex-1;
  var num2=midIndex+1;
 
 
  
    array[num1]="X";
    array[num2]="X";
    
    finalArray.push(array);

  console.log(finalArray) ;
  
}

createArray(5);


</script>

please some one show the reason for this.

.push() doesn't clone the array you're pushing into finalArray. You push the "same array" (a reference to the same array) twice. — Andreas
– Andreas, Commented Jul 28, 2020 at 6:03
Is JavaScript a pass-by-reference or pass-by-value language? — Andreas
– Andreas, Commented Jul 28, 2020 at 6:06

Ravi Chaudhary · Accepted Answer · 2020-07-28 06:55:49Z

3

In Javascript, objects(in your case array) are passed by reference. You push the array into finalArray and then update the array. But you have updated the data from same reference. So you could use spread operator which would effectively create a new array(with new reference) and you can push this array to finalArray

finalArray.push([...array]);

edited Jul 28, 2020 at 6:55

answered Jul 28, 2020 at 6:04

Ravi Chaudhary

6709 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

adiga Over a year ago

This is called spread syntax not destructuring

Always Helping Over a year ago

@adiga Was just about to comment the same. Spot ON

Basheer Kharoti · Accepted Answer · 2020-07-28 06:07:11Z

2

That's because Javascript objects are passed by reference. You should create a copy of the array and push to the final one

function createArray(x) {
  var arr=[];
  var finalArray=[];
  
  for(var i=1;i<=x;i++){
    arr[i-1]='O';
  }

  var midIndex=Math.round(x/2)-1;
  
  arr[midIndex]='X';


  finalArray.push(arr.slice());

  var num1=midIndex-1;
  var num2=midIndex+1;
 
 
  
    arr[num1]="X";
    arr[num2]="X";
    
    finalArray.push(arr.slice());

  console.log(finalArray) ;
  
}

createArray(5);

answered Jul 28, 2020 at 6:07

Basheer Kharoti

4,3025 gold badges27 silver badges51 bronze badges

Comments

HamidReza Heydari · Accepted Answer · 2020-07-28 06:22:53Z

2

It's for JS pointer When you Push array into final u push pointer of array into an index of final and when change array the final changed too.

for resolve it u can use easy Code:

finalArray.push([...array]);

GoodLuck

answered Jul 28, 2020 at 6:22

HamidReza Heydari

3001 silver badge9 bronze badges

Collectives™ on Stack Overflow

JavaScript Arrays .push() not working as Expected

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related