Edit specific element in JavaScript 2D array and not the column

Question

When manually creating a 2D array and editing a specific element I get the desired results. If I create it with a for loop and edit one element in the array, it changes the whole array in each row, in turn editing the whole column.

Is there a better way to create 2D arrays with a for loop to avoid this behavior?

var grid = [1,2,3];
var gridRows = ["O","O","O"];

for (var i = 0; i < grid.length; i++) {
    for(var j = 0; j < grid.length; j++) {
        grid[i] = gridRows;
    }
}

Image of the for loops output

//--------------------
//The manually created 2D Array
manualGrid = [["O","O","O"],["O","O","O"],["O","O","O"]];

Image of the manual methods output in console

UchihaItachi · Accepted Answer · 2017-11-09 18:16:54Z

1

Arrays are objects in javascript which are passed by reference . To avoid this just change your code to :

var grid = [1,2,3];
var gridRows = ["O","O","O"];

for (var i = 0; i < grid.length; i++) {
    for(var j = 0; j < grid.length; j++) {
        grid[i] = JSON.parse(JSON.stringify(gridRows));
    }
}

answered Nov 9, 2017 at 18:16

UchihaItachi

2,7421 gold badge17 silver badges22 bronze badges

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

Collectives™ on Stack Overflow

Edit specific element in JavaScript 2D array and not the column

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related