Assigning window variable to local variable

Question

I've been working on a web project, and I'm having an issue with assigning a window variable to another variable in Javascript.

For example, I have a function that generates a random code:

window.onload=function(){
    ...
    window.c=genCode(); //Gets an array with 4 strings like ['g', 'r', 'p', 'b'] (first letter of colors of the rainbow)
    ...
}

Then later on in the program, I have a test that will use the data in a variable, and minipulate the new variable

var guess=function(){
    ...
    let tempC=window.c;
    ...
    for(let i=0;i<4;i++){
        ...
        tempC[i]='n';
        ...
    }
}

The local variable tempC gets changed, but so does window.c.

My workaround is to just have a function that returns the variable.

var retCode=function(){
    return window.c;
}

This works, but why does this happen? When you assign data to a variable, I thought it should only modify the specified variable and not the one it gets the data from. Is this just a JavaScript quirk? Does it have to do something with how window works?

It's because you are passing a reference of the array. If you don't want the array to be altered, you must copy it: let tempC = JSON.parse(JSON.stringify(window.c));.. Or really, just look at this: stackoverflow.com/questions/9885821/… — briosheje
– briosheje, Commented Oct 15, 2018 at 14:57
an array is copied by reference not by value. So when you change tempC you are changing the array referenced by window.c — Fabrizio Calderan
– Fabrizio Calderan, Commented Oct 15, 2018 at 14:57
Basically, JS arrays are copied "by reference", not by value, so both window.c and tempC point to the same array in memory — Ayush Gupta
– Ayush Gupta, Commented Oct 15, 2018 at 14:57
@RandyCasburn I am a high school programmer. I'm still new and learning how to do a lot of stuff. Just chill. — scoutchorton
– scoutchorton, Commented Oct 15, 2018 at 15:01

briosheje · Accepted Answer · 2018-10-15 15:03:05Z

0

Arrays, in javascript, are passed by reference, you can read more about that here: Is JavaScript a pass-by-reference or pass-by-value language?

That said, to solve your specific case, just make a copy of the array. Because it's a small array, you don't even need to worry about performances, just do:

let tempC = JSON.parse(JSON.stringify(window.c));

This will convert the original array to a JSON-compliant string and parse it again, losing any reference to the original array.

If you don't like that approach, you can still find more here: Copying of an array of objects to another Array without object reference in javascript(Deep copy)

answered Oct 15, 2018 at 15:03

briosheje

7,4662 gold badges35 silver badges56 bronze badges

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

Comments

dgeare · Accepted Answer · 2018-10-15 15:00:42Z

Array's and Objects are passed by reference in JavaScript. That means that the variable contains a reference to a specific array, not the array itself. So when you make modifications to that array, they persist everywhere else.

var arr = [1,2,3,4,5];

function changesArr(t){
  t.push(6);
  t.push(7);
}

changesArr(arr);
console.log('1 to 7');
console.log(arr);

var newArr = arr;
newArr.push(8);
console.log('1 to 8');
console.log(arr);

If you want to get a copy of the array that won't muck with the original value, you need to use an operation that returns a new array. Like slice()

var arr = [1,2,3,4,5];

function changesArr(t){
  t.push(6);
  t.push(7);
}

var diffArr = arr.slice();
changesArr(diffArr);
console.log('1 to 5');
console.log(arr);

console.log('1 to 7');
console.log(diffArr);

Collectives™ on Stack Overflow

Assigning window variable to local variable

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related