2

I am trying to create a function which will dynamically set the value of whatever global variable is passed as a parameter. It's not working, and I'm trying to figure out why. Can someone please explain why this doesn't work:

var things = 5;

function setup(variable) {
    variable = 7;
}

setup(things);

console.log(things); //should return 7. returns 5 instead. the function had no effect on the global variable

and this also doesn't work:

var things = 5;

function setup(variable) {
    window.variable = 7;
}

setup(things);

console.log(things); //should return 7, but returns 5. still not accessing the global variable.

but this does:

var things = 5;

function setup(variable) {
    window[variable] = 7;
}

setup("things");

console.log(things); //returns 7

I suspect that what is happening is that the parameter variable is being set as a local variable inside of the function, so any changes are only happening to the local version. But this seems strange because the parameter that's been passed is a global variable. Can someone explain to me what is happening and how to better write this code? Does this require a method (which can then use this to access the original object)?

Thanks!!

Taylor L.
  • 23
  • 1
  • 5
  • If it's a global variable, you don't need to pass it in to the function to access it, so you could just write function setup() { things = 7; } – Codermonk Dec 24 '14 at 19:44
  • You need to learn about pass by reference vs pass by value with JavaScript. You are not passing the variable! You are passing the value. – epascarello Dec 24 '14 at 19:47
  • In your first example you are just passing by value, the second you are changing the value of `window.variable`. If you were to write the second example like your third it would be like doing `window["variable"]`. – NickSlash Dec 24 '14 at 19:50
  • Possible duplicate of [Passing a global variable to a function](https://stackoverflow.com/questions/18178728/passing-a-global-variable-to-a-function) – Sebastian Simon Jul 08 '18 at 00:42

3 Answers3

2

Javascript is pass-by-value. (Objects, arrays, and other non-primitives are passed by value-of-reference.) That means that the value of the variable (or reference) is passed to the function, but the function parameter does not become an alias for the actual argument. Thus, you cannot change a variable outside a function without referencing it (as you do in your last example).

See this answer in another thread for more information.

Community
  • 1
  • 1
Ted Hopp
  • 232,168
  • 48
  • 399
  • 521
  • Oh, now I get it. The post you linked to was exactly what I was trying to figure out. Technically, it is correct that all variables are passed by value in JavaScript. However, practically, the value of an object/array is a reference to the object/array. Which means that an object can indeed by changed by a function in a way that a primitive cannot. – Taylor L. Dec 24 '14 at 23:32
1

Inside of functions are "variable environments". When the function setup is declared, and the parameter variable set, it creates a local variable in setup's variable environment for variable (the parameter).

So that is why this assignment

function setup(variable) {
 variable = 7;
}

Will never change the value sent to variable.

Variables in JavaScript are values. As the variable is passed around, the only thing passed is the value of the variable. However, the value of the variable is assigned to the parameter (again poorly named in this example) variable. When the value of the parameter is assigned to 7, that only changes the local variable, and not the value of the passed variable.

//the value of things is 5
var things = 5;

//the passed value 5 is assigned to variable
function setup(variable) {
  //the value of variable is changed to 7 (and nothing is done with 5)
  variable = 7;
}

//the value of things is sent to setup
setup(things);

Hopefully this will be a little more enlightening. Consider a situation where setup was actually modifying the value of variable. A good example is when the value has state, such as an array or an object.

//the value of things this time is an object
var things = {};

//the passed value of object is assigned to variable
function setup(variable){
 //the value of variable (the object) has a property added named msg with a value of "hello world"
 variable.msg = "hello world";
}

//the value of things (an object) is sent to setup
setup(things);
alert(things.msg);//hello world
Travis J
  • 81,153
  • 41
  • 202
  • 273
  • Wait, so, if setting `variable` equal to `"hello world"` does not change the value of `things`, why does making `things` an object and setting `variable.property` equal to `"hello world"` change the value of `things.property`? – Taylor L. Dec 24 '14 at 23:20
  • The link in Ted Hoop's answer explains that. The value of a primitive is the simply the value of the primitive, while value of an object is a reference to the object. Therefore it CAN be accessed by the function. – Taylor L. Dec 24 '14 at 23:37
0

When variables are passed as arguments to functions, a copy of their value is made and assigned to the name of the argument in the function.

For example:

function foo(a) {
    a = 7; // sets the temporary variable(argument) a to 7
}

var bar = 24; 
foo(bar); // copies bar's value and passes in the copy to foo

For a function to modify a variable itself, you would have to access it another way. In other languages there are things called pointers that point to a place in memory. This allows you to modify variables directly, as you have where they are located - you can simulate this with JavaScript:

var spam = 3;
var memory = ["bar", 29, "x", foo, false];

function foo(a) {
    memory[a] = 7;
}

foo(3);

The above example sets an array called memory and fills it with random gibberish. Then, a function named foo is created that allows for the modification of elements in this memory array.

SirPython
  • 647
  • 6
  • 19