Javascript Object delete - deletes another object

Question

I have two Objects:

  var parameters = [{
    id: 1,
    name: "test1"
  }, {
    id: 2,
    name: "test2"
  }];


  var person = {
    name: "Harry",
    parameters: [{
      id: 1
    }, {
      id: 2
    }]
  };

I set person.parameters with the other object:

person.parameters = parameters;

Now I want to delete something from person.parameters:

delete person.parameters[0].id;

Why is parameter[0].id not longer accessible?

console.log(parameters[0].id);

Result:

undefined

Because `person.parameters` is not a copy of `parameters`, but a coreference. They point at the same thing. John Wilkes Booth killed the US president at the time, but Abraham Lincoln ended up dead. How? Because "Abraham Lincoln" and "US president at the time" refer to the same person, they're not independent clones of each other. Same thing. — Amadan, Aug 15 '18 at 11:55
Possible duplicate of [Modifying a copy of a JavaScript object is causing the original object to change](https://stackoverflow.com/questions/29050004/modifying-a-copy-of-a-javascript-object-is-causing-the-original-object-to-change) — t.niese, Aug 15 '18 at 12:58

amrender singh · Answer 1 · 2018-08-15T13:01:04.597

When you do :

person.parameters = parameters;

You just pass reference of the array parameters to person.parameter. So both parameter and person.parameter points to the same reference. Therefore changes made in any one of them will reflect in other.

Basically you have something in the memory as:

a:ref12344−−−+
             |
             |
             |    +−−−−−−−−−−−−−+                 
             +−−−>|  Array      |                 
             |    +−−−−−−−−−−−−−+                 
             |    | obj 1       |         
             |    | obj 2       |
b :ref12345−−+    |             |       
                  |             |
                  +−−−−−−−−−−−−−+

Simply deep copy your array, to make separate references:

person.parameters = parameters.map(a => ({...a}));

score 0 · Answer 2 · answered Aug 15 '18 at 11:53

0

Because you assigned it to the same object in memory. If you don't want to manipulate the same object you should copy parameters when assigning it to person.

answered Aug 15 '18 at 11:53

Tyrone Wilson

4,328
2
31
35

score 0 · Answer 3 · answered Aug 15 '18 at 13:09

Objects and Arrays are passed by reference.

In Javascript and in almost every programming language, objects and arrays are passed by reference. That means when you set them to a new variable, you don't actually create a copy of it that gets set to the new variable. Instead, it's the same exact array/object in memory that the new variable gets the reference of. Whereas, when you set a variable to a primitive value like a number or a string you actually get a copy of it. So, when you modify an array/object every variable that the object has been referenced within your code would get updated with its new value.

Objects are not really passed by reference, more as copy of reference or as value. If it would be as reference then `function foo(x) { x = {test:2}} a={}; foo(a); console.log(a)` would result in `a` being `{test:2}` . — t.niese, Aug 15 '18 at 14:02

Javascript Object delete - deletes another object

3 Answers3