0

I faced an issue recently:

I had an object Recipe with a primitive datatype i.e string.

export class Recipe {

    public name: string;

}

When I created an object of this type and passed it around components, every component got a new copy of this object.

I google and found in one of the answers that its because my object contains a primitive datatype and hence it can't be passed with reference and the receiver will get a copy instead.

Fair enough.

The problem is, when I created an array of objects where the object contained primitive types, I was able to share the array with all its values successfully among other components. Any change in my array was reflecting in all places where I had passed it.

Why is that an object with primitive types can not be passed as a reference but an array can?

mfs
  • 3,984
  • 6
  • 32
  • 51
  • Are you sure that it isn't being passed by reference? All JS objects, including arrays, are always passed by reference. And generally a JS will ultimately have values in it that are primitive types: array of strings, object with strings and numbers for the values, etc. How are you 'creating' that object that gets passed into components? – pseudosavant Jul 09 '20 at 18:43
  • I am quoting it from the answer that i linked above: "Since name in NameService is a primitive type, you'll get different instance in the service and your components. When you change name in NameService, the component properties still have the initial value and the binding doesn't work as expected." – mfs Jul 09 '20 at 18:46
  • 1
    a different instance of the primitive type variable not the object that holds it. objects are always passed as reference in JS. – Stavm Jul 09 '20 at 18:46
  • Correct. Everything else is passed by value. – pseudosavant Jul 09 '20 at 18:49
  • @Stavm Does it mean that If I pass an object and later update the value of one of its primitive data type, the change won't be reflected? – mfs Jul 09 '20 at 18:50
  • the other way around. if you pass in an object to a function, and change it there, the change will affect the original object. if you pass in a string, and change it, original will not be affected. because its a primitive type. notice that by change i mean `object.property = 'new value'` not `object = somethingelse` because the latter is not changing its creating a new reference. – Stavm Jul 09 '20 at 18:51
  • 1
    Objects are passed by value reference, just like arrays (which are just objects with specific structure). Angular or whatever library you were using probably were just doing a shallow copy when transfering between components. When arrays are shallow copied the objects in it still hold the reference to the original object. – Patrick Evans Jul 09 '20 at 18:51
  • @Stavm I passed an object in a function and then updated it in original, shouldn't it reflect in function too? When I passed an array to a function and updated it in original, its reflecting in the function. But when I pass an object and update it in original, it is not reflecting in the function. – mfs Jul 09 '20 at 19:13

0 Answers0