In C/C++ I know we had pointers to objects and arrays, so they could be passed into function parameters without the need to clone said objects and arrays. In Javascript there's no such option, so we just use the object variable.

Is this good practise?

function setWhite(obj){
  obj.color = "white";
}

var shirt = {
  color: "red",
  size: "L"
}

setWhite(shirt);

console.log(shirt);

In C/C++ I know we had pointers to objects and arrays, so they could be passed into function parameters without the need to clone said objects and arrays. In Javascript there's no such option, so we just use the object variable.

Is this good practise?

function setWhite(obj){
  obj.color = "white";
}

var shirt = {
  color: "red",
  size: "L"
}

setWhite(shirt);

console.log(shirt);

• javascript
• javascript-objects

• You are not cloning anything. You just pass a reference to your object by value. – PM 77-1 Commented Oct 18, 2018 at 19:29
• 2 But is it ok to do this? it doesn't throw an error, so the answer is "yes". Is it good practise? it depends. A lot of times mutating an object leads to unnecessary plexity. Then agian, a lot of times it's fine to do it as it simplifies things. So clearly...there is no clear answer to this. – VLAZ Commented Oct 18, 2018 at 19:29
• As a side note, I think you mean to say "pass objects", not "parse objects". Parsing is like taking apart and understanding data. Reading through and understanding it. Passing is the term you use to give data to a function. – Jake T. Commented Oct 18, 2018 at 19:34
• 1 @JakeT., corrected accordingly – João Pimentel Ferreira Commented Oct 18, 2018 at 19:45
• 1 @JoãoPimentelFerreira missed one in the body of the question. It's a nit picky thing to point out, but then again, pilers are very nit picky, too haha. And it can be difficult to look up a question without the right words. – Jake T. Commented Oct 18, 2018 at 19:49

1 Answer 1

Yes. In javascript, objects are passed by reference. So, if you change the value of an object within the function, it changes it back outside of the function.

If you did something like this, though, it wouldn't be the case:

function setWhite(obj){
  obj = {
    color: "white",
    size: "M"
  }
}

var shirt = {
  color: "red",
  size: "L"
}

setWhite(shirt);

console.log(shirt); // shirt will remain red / L

Note the difference is that I'm reassigning obj inside the setWhite() method, so the original obj is lost to that function.

This is an important concept to understand, since it can have disturbing and unintended consequences if you let it slip your mind, accidentally changing the value on objects that you didn't want to change, just temporarily manipulate the data for some other purpose. It's especially important to keep in mind when you start working with async functions. Async functions happen in the background, and you have to specify when to 'await' for them. If you call an async function expecting it to change your objects values, but don't await it, your object might not have the updated values yet when you go to use them later in the code that calls the async function.

Similarly, if you call an async function, but don't await it, and later change the object that was passed in, by the time the async function goes to use the values from that object, they could be different than you intended when you called it.