javascript传递的匿名函数不会更改参数的值

Question

I used anonymous function as parameter in another function, and the anonymous function itself has parmeters also.When the another function is running, and the anonymous func does not work as I expected.I was coufused, can you help? The code is below:

function go(x, func){
  func(x);
  alert(x.x);
}

var x = {'x': 3};
go(x, function(x){x = {'x':99};});//actually it alert 3, not 99, x not change
go(x, function(x){x.x = 7;}); //it behaves normal, alert 7, not 3

Answer 1

What is x ?
var x = {'x': 3};

x is variable which is a reference to the actual value of the object.

First Scenario:
go(x, function(x){x = {'x':99};});//actually it alert 3, not 99, x not change

When the function is invoked using func(x); the value of reference is passed by value Following activities happen

1. A new variable x is created
2. Assign the value of x (created in step 1) to global variable x , effectively x contains a reference of the global variable x.
3. Next, when you make any change to x like x = {'x':99}; it will just create a new Object {'x':99} and assign the new reference of the new Object to x. Hence, x (step 1) is pointing to a new object, which has value of x as 99.
4. In next line alert(xx); x is pointing to global object and since the global object x is not modified the value of xx is still 3 .

Second Scenario:
go(x, function(x){xx = 7;}); //it behaves normal, alert 7, not 3

First few steps are similar

1. A new variable x is created
2. Assign the value of x (created in step 1) to global variable x , effectively x contains a reference of the global variable x.
3. This statement {xx = 7;} is actually a kind of dereference or you are trying to fetch the value of the global object x and then assigning a new value of 7 to the global object x property x . You are modifying the global object and not changing the reference of x to a new object as was done in the first scenario. So changes are reflected across the global object x .
4. Next, the statement alert(xx); The x is the global object, but in this case the value of xx (global) has been modified by the anonymous function.

Answer 2

The difference is how JS interprets the codes x = { x: 99} and xx = 7 The first code means that you create completely new anonymous object {x: 99} , and then change the reference of the global variable x to this object. Meanwhile the second code just gets the reference to the global variable x and change it's property. That's it :)

Answer 3

For explanations see above anwers. This is a fix to your problem:

function go(x, func){
  x=func(x)||x;
   alert(x.x);
 }

var x = {'x': 3};
go(x, function(x){return {'x':99};});//works now
go(x, function(x){x.x = 7;}); //it behaves normal, alert 7, not 3