Pass variables by reference in JavaScript

Question

How do I pass variables by reference in JavaScript  I have three variables that I want to perform several operations to  so I want to put them in a for loop and perform the operations to each one  Pseudocode  myArray   new Array var1  var2  var3   for  var x   0  x  lt  myArray length  x            Do stuff to the array     makePretty myArray x         Now do stuff to the updated variables  What is the best way to do this

User · Answer

JavaScript can modify array items inside a function (it is passed as a reference to the object/array).

function makeAllPretty(items) {
   for (var x = 0; x < myArray.length; x++){
      // Do stuff to the array
      items[x] = makePretty(items[x]);
   }
}

myArray = new Array(var1, var2, var3);
makeAllPretty(myArray);

Here's another example:

function inc(items) {
  for (let i=0; i < items.length; i++) {
    items[i]++;
  }
}

let values = [1,2,3];
inc(values);
console.log(values);
// Prints [2,3,4]

User · Answer

primitive type variables like strings and numbers are always passed by value  Arrays and Objects are passed by reference or by value based on these conditions    if you are setting the value of an object or array it is Pass by Value   object1    prop   car    array1    1 2 3   if you are changing a property value of an object or array then it is Pass by Reference   object1 prop    car   array1 0    9     Code   x000D   x000D  function passVar obj1  obj2  num    x000D      obj1 prop    laptop      will CHANGE original x000D      obj2     prop   computer       will NOT affect original x000D      num   num   1     will NOT affect original x000D    x000D   x000D  var object1     x000D      prop   car  x000D     x000D  var object2     x000D      prop   bike  x000D     x000D  var number1   10  x000D   x000D  passVar object1  object2  number1   x000D  console log object1     output  Object  item  laptop   x000D  console log object2     output  Object  item  bike   x000D  console log number1     ouput  10 x000D   x000D   x000D

User · Answer

JavaScript not being strong type  It allows you to resolve problems in many different ways  as it seem in this question  However  for a maintainability point of view  I would have to agree with Bart Hofland  A function should get arguments to do something with and return the result  Making them easily reusable  If you feel that variables need to be passed by reference  you may be better served building them into objects  IMHO

User · Answer

Workaround to pass variable like by reference  var a   1  inc   function variableName      window variableName     1      inc  a     alert a      2  And yup  actually you can do it without access a global variable  inc    function          var variableName   0       var init   function              variableName    1          alert variableName              return init         inc

User · Answer

Actually it is really easy  The problem is understanding that once passing classic arguments  you are scoped into another  read-only zone  The solution is to pass the arguments using JavaScript s object-oriented design  It is the same as putting the arguments in a global scoped variable  but better    function action         Process this arg  modification allowed       action arg      quot empty-array quot     quot some string quot   0x100   quot last argument quot    action     You can also promise stuff up to enjoy the well-known chain  Here is the whole thing  with promise-like structure function action         Process this arg  modification allowed      this arg     quot a quot    quot b quot       action setArg   function   this arg   arguments  return this    action setArg   quot empty-array quot     quot some string quot   0x100   quot last argument quot      Or better yet    action setArg   quot empty-array quot    quot some string quot  0x100  quot last argument quot   call

User · Answer

Yet another approach to pass any  local  primitive  variables by reference is by wrapping variable with closure  quot on the fly quot  by eval  This also works with  quot use strict quot    Note  be aware that eval is not friendly to JavaScript optimizers  and also missing quotes around variable name may cause unpredictive results   quot use strict quot      Return text that will reference variable by name  by capturing that variable to closure  function byRef varName       return  quot   get value   return  quot  varName  quot     set value v   quot  varName  quot  v     quot         Demo     Assign argument by reference function modifyArgument argRef  multiplier       argRef value   argRef value   multiplier      function        var x   10       alert  quot x before   quot    x       modifyArgument eval byRef  quot x quot     42       alert  quot x after   quot    x         Live sample  https   jsfiddle net t3k4403w

User · Answer

Simple Object  x000D   x000D  function foo x         Function with other context      Modify  x  property  increasing the value   x value          Initialize  ref  as object var ref          The  value  is inside  ref  variable object      The initial value is  1    value  1        Call function with object value foo ref      Call function with object value again foo ref    console log ref value      Prints  3  x000D   x000D   x000D    Custom Object Object rvar  x000D   x000D         Aux function to create by-references variables     function rvar name  value  context         If  this  is a  rvar  instance   if  this instanceof rvar           Inside  rvar  context                Internal object value     this value   value              Object  name  property     Object defineProperty this   name     value  name                 Object  hasValue  property     Object defineProperty this   hasValue           get  function                 If the internal object value is not  undefined          return this value     undefined                              Copy value constructor for type-check     if   value     undefined   amp  amp   value     null           this constructor   value constructor                    To String method     this toString   function               Convert the internal value to string       return this value                  else          Outside  rvar  context                Initialice  rvar  object     if   rvar refs          rvar refs                         Initialize context if it is not defined     if   context          context   window                    Store variable     rvar refs name    new rvar name  value  context               Define variable at context     Object defineProperty context  name             Getter       get  function      return rvar refs name               Setter       set  function  v    rvar refs name  value   v              Can be overrided        configurable  true                 Return object reference     return context name             Variable Declaration       Declare  test ref  variable   rvar  test ref 1          Assign value  5    test ref 1   5       Or   test ref 1 value   5        Or declare and initialize with  5     rvar  test ref 2   5       ------------------------------    Test Code     Test Function function Fn1  v    v value   100        Declare rvar  test ref number        First assign test ref number   5  console log  test ref number value     5   test ref number value     5       Call function with reference Fn1 test ref number   console log  test ref number value     100   test ref number value     100       Increase value test ref number    console log  test ref number value     101   test ref number value     101       Update value test ref number   test ref number - 10  console log  test ref number value     91   test ref number value     91       Declare and initialize rvar  test ref str    a    console log  test ref str value      a    test ref str value      a        Update value test ref str     bc   console log  test ref str value      abc    test ref str value      abc        Declare other    rvar  test ref number   5   test ref number value     5     true     Call function Fn1 test ref number   test ref number value     100     true     Increase value test ref number    test ref number value     101     true     Update value test ref number   test ref number - 10  test ref number value     91     true  test ref str value      a      true     Update value test ref str     bc   test ref str value      abc      true  x000D   x000D   x000D

User · Answer

I know exactly what you mean  The same thing in Swift will be no problem  The bottom line is use let  not var  The fact that primitives are passed by value  but the fact that the value of var i at the point of iteration is not copied into the anonymous function is quite surprising to say the least  for  let i   0  i  lt  boxArray length  i        boxArray i  onclick   function     console log i        Correctly prints the index

User · Answer

If you want to pass variables by reference  a better way to do that is by passing your arguments in an object and then start changing the value by using window  window  quot varName quot     value   Example     Variables with first values var x   1  b   0  f   15    function asByReference       argumentHasVars            Passing variables in object     newValues                  Pass new values in array       let VarsNames               Getting variables names one by one     for let name in argumentHasVars          VarsNames push name           Accessing variables by using window one by one     for let i   0  i  lt  VarsNames length  i    1          window VarsNames i     newValues i      Set new value    console log x  b  f      Output with first values  asByReference  x  b  f    5  5  5       Passing as by reference  console log x  b  f      Output after changing values

User · Answer

I ve been playing around with syntax to do this sort of thing  but it requires some helpers that are a little unusual   It starts with not using  var  at all  but a simple  DECLARE  helper that creates a local variable and defines a scope for it via an anonymous callback  By controlling how variables are declared  we can choose to wrap them into objects so that they can always be passed by reference  essentially  This is similar to one of the Eduardo Cuomo s answer above  but the solution below does not require using strings as variable identifiers   Here s some minimal code to show the concept   function Wrapper val       this VAL   val    Wrapper prototype toString   function        return this VAL toString       function DECLARE val  callback       var valWrapped   new Wrapper val           callback valWrapped      function INC ref       if ref  amp  amp  ref hasOwnProperty  VAL             ref VAL               else          ref     or maybe throw here instead             return ref     DECLARE 5  function five     consider this line the same as  let five   5  console log  five is now     five   INC five      increment console log  five is incremented to     five

User · Answer

Putting aside the pass-by-reference discussion  those still looking for a solution to the stated question could use   const myArray   new Array var1  var2  var3   myArray forEach var   gt  var   makePretty var

User · Answer

I like to solve the lack of by reference in JavaScript like this example shows  The essence of this is that you don t try to create a by reference  You instead use the return functionality and make it able to return multiple values  So there isn t any need to insert your values in arrays or objects   x000D   x000D  var x    First   var y    Second   var z    Third    log  Before call   x y z   with  myFunc x  y  z    x   a  y   b  z   c       lt -- Way to call it log  After call    x y z     function myFunc a  b  c      a    Changed first parameter     b    Changed second parameter     c    Changed third parameter     return  a a  b b  c c       lt -- Return multiple values    function log txt p1 p2 p3      document getElementById  msg   innerHTML    txt     lt br gt     p1     lt br gt     p2     lt br gt     p3     lt br gt  lt br gt     x000D   lt div id  msg  gt  lt  div gt  x000D   x000D   x000D

User · Answer

There is no  pass by reference  available in JavaScript  You can pass an object  which is to say  you can pass-by-value a reference to an object  and then have a function modify the object contents   function alterObject obj      obj foo    goodbye      var myObj     foo   hello world      alterObject myObj    alert myObj foo       goodbye  instead of  hello world    You can iterate over the properties of an array with a numeric index and modify each cell of the array  if you want   var arr    1  2  3    for  var i   0  i  lt  arr length  i           arr i    arr i    1       It s important to note that  pass-by-reference  is a very specific term  It does not mean simply that it s possible to pass a reference to a modifiable object  Instead  it means that it s possible to pass a simple variable in such a way as to allow a function to modify that value in the calling context   So    function swap a  b       var tmp   a     a   b     b   tmp    assign tmp to b      var x   1  y   2   swap x  y     alert  x is     x      y is     y       x is 1  y is 2    In a language like C    it s possible to do that because that language does  sort-of  have pass-by-reference   edit  mdash  this recently  March 2015  blew up on Reddit again over a blog post similar to mine mentioned below  though in this case about Java  It occurred to me while reading the back-and-forth in the Reddit comments that a big part of the confusion stems from the unfortunate collision involving the word  reference   The terminology  pass by reference  and  pass by value  predates the concept of having  objects  to work with in programming languages  It s really not about objects at all  it s about function parameters  and specifically how function parameters are  connected   or not  to the calling environment  In particular  note that in a true pass-by-reference language  mdash  one that does involve objects  mdash  one would still have the ability to modify object contents  and it would look pretty much exactly like it does in JavaScript  However  one would also be able to modify the object reference in the calling environment  and that s the key thing that you can t do in JavaScript  A pass-by-reference language would pass not the reference itself  but a reference to the reference   edit  mdash  here is a blog post on the topic   Note the comment to that post that explains that C   doesn t really have pass-by-reference   That is true  What C   does have  however  is the ability to create references to plain variables  either explicitly at the point of function invocation to create a pointer  or implicitly when calling functions whose argument type signature calls for that to be done  Those are the key things JavaScript doesn t support

User · Answer

I personally dislike the  pass by reference  functionality offered by various programming languages  Perhaps that s because I am just discovering the concepts of functional programming  but I always get goosebumps when I see functions that cause side effects  like manipulating parameters passed by reference   I personally strongly embrace the  single responsibility  principle   IMHO  a function should return just one result value using the return keyword  Instead of modifying a parameter argument  I would just return the modified parameter argument value and leave any desired reassignments up to the calling code   But sometimes  hopefully very rarely   it is necessary to return two or more result values from the same function  In that case  I would opt to include all those resulting values in a single structure or object  Again  processing any reassignments should be up to the calling code   Example   Suppose passing parameters would be supported by using a special keyword like  ref  in the argument list  My code might look something like this     The Function function doSomething ref value        value    Bar        The Calling Code var value    Foo   doSomething value   console log value     Bar   Instead  I would actually prefer to do something like this     The Function function doSomething value        value    Bar       return value       The Calling Code  var value    Foo   value   doSomething value     Reassignment console log value     Bar   When I would need to write a function that returns multiple values  I would not use parameters passed by reference either  So I would avoid code like this     The Function function doSomething ref value        value    Bar          Do other work     var otherValue    Something else        return otherValue       The Calling Code var value    Foo   var otherValue   doSomething value   console log value     Bar console log otherValue     Something else   Instead  I would actually prefer to return both new values inside an object  like this     The Function function doSomething value        value    Bar          Do more work     var otherValue    Something else        return           value  value          otherValue  otherValue             The Calling Code  var value    Foo   var result   doSomething value   value   result value    Reassignment console log value     Bar console log result otherValue     These code examples are quite simplified  but it roughly demonstrates how I personally would handle such stuff  It helps me to keep various responsibilities in the correct place   Happy coding

User · Answer

There s actually a pretty sollution   function updateArray context  targetName  callback        context targetName    context targetName  map callback      var myArray     a    b    c    updateArray this   myArray   item   gt   return       item     console log myArray      3     a     b     c

[javascript] Pass variables by reference in JavaScript

Examples related to javascript

Examples related to variables

Examples related to pass-by-reference