JavaScript by reference vs by value

Question

I m looking for some good comprehensive reading material on when JavaScript passes something by value and when by reference and when modifying a passed item affects the value outside a function and when not   I m also interested in when assigning to another variable is by reference vs  by value and whether that follows any different rules than passing as a function parameter   I ve done a lot of searching and find lots of specific examples  many of them here on SO  from which I can start to piece together pieces of the real rules  but I haven t yet found a single  well written document that describes it all   Also  are there ways in the language to control whether something is passed by reference or by value   Here are some of the types of questions I want to understand   These are just examples - I m actually looking to understand the rules the language goes by  not just the answers to specific examples   But  here are some examples   function f a b c       a   3     b push  foo       c first   false     var x   4  var y     eeny    miny    mo    var z    first  true   f x y z     When are the contents of x  y and z changed outside the scope of f for all the different types   function f         var a     1    2    3        var b   a 1       a 1     4          what is the value of b now for all possible data types that the array in  a  might hold     function f         var a     yellow   blue     red   cyan     green   magenta         var b   a 1       a 1  red    tan          what is the value of b now and why      b red    black          did the value of a 1  red change when I assigned to b red      If I want to make a fully independent copy of an object  no references whatsoever   what s the best practice way to do that

User · Accepted Answer

My understanding is that this is actually very simple:

Javascript is always pass by value, but when a variable refers to an object (including arrays), the "value" is a reference to the object.
Changing the value of a variable never changes the underlying primitive or object, it just points the variable to a new primitive or object.
However, changing a property of an object referenced by a variable does change the underlying object.

So, to work through some of your examples:

function f(a,b,c) {
    // Argument a is re-assigned to a new value.
    // The object or primitive referenced by the original a is unchanged.
    a = 3;
    // Calling b.push changes its properties - it adds
    // a new property b[b.length] with the value "foo".
    // So the object referenced by b has been changed.
    b.push("foo");
    // The "first" property of argument c has been changed.
    // So the object referenced by c has been changed (unless c is a primitive)
    c.first = false;
}

var x = 4;
var y = ["eeny", "miny", "mo"];
var z = {first: true};
f(x,y,z);
console.log(x, y, z.first); // 4, ["eeny", "miny", "mo", "foo"], false

Example 2:

var a = ["1", "2", {foo:"bar"}];
var b = a[1]; // b is now "2";
var c = a[2]; // c now references {foo:"bar"}
a[1] = "4";   // a is now ["1", "4", {foo:"bar"}]; b still has the value
              // it had at the time of assignment
a[2] = "5";   // a is now ["1", "4", "5"]; c still has the value
              // it had at the time of assignment, i.e. a reference to
              // the object {foo:"bar"}
console.log(b, c.foo); // "2" "bar"

User · Answer

Primitive type variable like string number are always pass as  pass by value  Array and Object is passed as  pass by reference or  pass by value based on these two condition    if you are changing value of that Object or array with new Object or Array then it is pass by Value   object1    item   car      array1  1 2 3     here you are assigning new object or array to old one you are not changing the value of property  of old object so it is pass by value    if you are changing a property value of an object or array then it is pass by Reference   object1 item   car     array1 0  9    here you are changing a property value of old object you are not assigning new object or array to old one so it is pass by reference    Code      function passVar object1  object2  number1             object1 key1   laptop           object2                 key2   computer                     number1   number1   1             var object1             key1   car             var object2             key2   bike             var number1   10       passVar object1  object2  number1       console log object1 key1       console log object2 key2       console log number1    Output  -     laptop     bike     10

User · Answer

Yes  Javascript always passes by value  but in an array or object  the value is a reference to it  so you can  change  the contents   But  I think you already read it on SO  here you have the documentation you want   http   snook ca archives javascript javascript pass

User · Answer

Javascript always passes by value  However  if you pass an object to a function  the  value  is really a reference to that object  so the function can modify that object s properties but not cause the variable outside the function to point to some other object   An example   function changeParam x  y  z      x   3    y    new string     z  key2      new     z  key3      newer      z     new     object       var a   1      b    something       c     key1     whatever    key2     original value     changeParam a  b  c       at this point a is still 1    b is still  something     c still points to the same object but its properties have been updated    so it is now   key1     whatever    key2     new    key3     newer      c definitely doesn t point to the new object created as the last line    of the function with z

[javascript] JavaScript by reference vs. by value

Examples related to javascript

Examples related to reference

Examples related to pass-by-reference

Examples related to pass-by-value