javascript: modify global variable from local variable

Question

I don't understand why in the function change2, the console doesn't output 2, but undefined?

var users = {a:1, b:2};

function change1(people){
    people.c = {};
    var C = people.c;
    setTimeout(function(){        
        C.number = 2;
    }, 1000);
}

function change2(people){
    people.c = {};
    var C = people.c;
    setTimeout(function(){
        console.log(C.number);
    }, 2000);
}

change1(users);
change2(users); // undefined, why not 2?

However, if I replace C.number by people.c.number within setTimeout of change1, it works(outputs 2), why? Don't they refer the same thing?

andrew_m · Accepted Answer · 2014-08-24 11:23:49Z

3

Your change1 function assigns a new object to people.c and also stores it in local C variable. Then in change2 you create another new object and store is in people.c. So people.c (or rather users.c) holds now that second object.

After 1 second your change1 function creates a "number" property in the first object. But people.c already holds a second object which stays not modified. So after another 1 second change2 tries to find "number" property in the second object which do not have such property.

So in short you should remove

people.c = {};

from change2 so avoid overriding the people.c property.

edited Aug 24, 2014 at 11:23

answered Aug 24, 2014 at 11:12

andrew_m

1213 bronze badges

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

Comments

albanx · Accepted Answer · 2014-08-24 12:06:03Z

1

This is my explanation. In the change1 this creates a new object, lets call it object1, and keeps a reference in the local variable C:

  people.c = {};
  var C = people.c;

In change2 let change the name of C in B (for avoiding confusion)

people.c = {};
var B = people.c;

This creates another new object, lets call it object2, that overrides the reference in people.c (so people.c points to this new object) and stores a reference to the local variable B.

So the local variable C in change1 points to object1, the local variable B points to object2 and people.c points to object2.

C.number = 2

will define the number property of object1 in change1

meanwhile

console.log(B.number) //console.log(C.number) in the original code

will try to output the property of object2 that is undefined.

Basically C in change1 and C in change2 are pointing to two different objects. setTimeout does not have any effect in this.

edited Aug 24, 2014 at 12:06

answered Aug 24, 2014 at 11:14

albanx

6,3439 gold badges72 silver badges99 bronze badges

3 Comments

webketje Over a year ago

How is people global scope? It's simply a function parameter. You're right in the explanations, but I don't understand how your answer is pertinent to the question. Here it's simply because OP reassigns an empty object to people.c (or users.c) in the change2 function, as noted by @andrew_m...

Maria Over a year ago

@albanx Thanks for the clear explanation, I got it now.

albanx Over a year ago

It was really a nice hassle that make me really curios, so it was exercise even for me.

Collectives™ on Stack Overflow

javascript: modify global variable from local variable

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related