JavaScript: call by Value or call by Reference

What is call by value ?
In call by value method, the called function creates a new set of variables and copies the values of arguments into them.
Means
Whatever value we will pass to the function, it will create a copy of that and will act on the copied one. So the origin value doesn’t change.

What is call by reference ?
In call by reference method, instead of passing a value to the function being called a reference/pointer to the original variable is passed.
Means
Whatever value we will pass to the function, it will act on the same value and if it modifies that value, it will get changed for the whole context.

The above definitions and explanations is generic to any language. Now lets get into some JavaScript code to understand it.

JS Example: Call by value

 function modifier(arg1){
  /*Creates copy of the parameter passed to the function and operates on it.*/
  console.log(arg1); //=> foo
  /*Change made in the local copy of the function*/
  arg1 = arg1 + " changed";
  console.log(arg1); //=> foo changed
}

/*Create a variable which stores the string "foo"*/
var foo = "foo";
modifier(foo);
/*Though function made changes, its value is still same. As function made changes in its local copy.*/
console.log(foo); //=> foo

In JavaScript, there are 5 primitive values:
1) Number
2) String
3) Boolean
4) Undefined
5) Null.

Now, In the above example
– We have created a var foo, which contains “foo” i.e a string having value foo.
– Now, as we know that Strings are of primitive type in JS. We can say that var foo contains a primitive value.
– And in JS, primitive values are called by value.

JS Example: Call by reference

function objModifier(obj1){
  console.log(obj1.name); //=> fooBar
  obj1.name = obj1.name + " changed";
  console.log(obj1.name); //=> fooBar changed
}

var myObj = {name: "fooBar"}
console.log(myObj.name); //=> fooBar
objModifier(myObj);
console.log(myObj.name); //=> fooBar changed

Every thing other than Number, String, Boolean, Undefined and Null are object in JavaScript. And objects are reference value in JS.
So, in above example, when we are passing myObj to the function objModifier, the reference is passed and the change made inside the method is reflected every where.

To summarize
To differentiate the difference between call by value and call by reference, we can have a rule of thumb as:

– Number, String, Boolean, Undefined and Null are primitives.
– Primitives are call by value.

– Every thing other than Number, String, Boolean, Undefined and Null are object.
– And objects are call by reference.

Advertisements
Tagged with: ,
Posted in Javascript

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: