2

I have an object "a" and I assign it to another variable named "b". Now I delete some property values from "b" using delete keyword. It deletes that property from both objects "a" and "b". Why is that?

P.S: I am beginner in javascript. go easy on me.

Code: -

let a = {
  a:1,
  b:2,
  c:3
}

let b = a;
console.log(a);   // output   { a: 1, b: 2, c: 3 }
delete b.a;
console.log(a)   // Expected output { a: 1, b: 2, c: 3 }    -- Actual output { b: 2, c: 3 }
Usama Tahir
  • 1,707
  • 3
  • 15
  • 30
  • 2
    this is pass by reference, here both `a` and `b` will have same value so it is deleting from same value – Vivek Jul 07 '18 at 19:27
  • 3
    Both "b" and "a" are variables pointing to the *same* object. – Josh Jul 07 '18 at 19:27
  • Possible duplicate of [How to copy/clone a hash/object in JQuery?](https://stackoverflow.com/questions/7113865/how-to-copy-clone-a-hash-object-in-jquery) – klutt Jul 07 '18 at 19:28
  • you ar referring a to b. u r not copying values of a into b array. it can be b = {...a} – Prince Sodhi Jul 07 '18 at 19:45

3 Answers3

2

Your question is more related to the fact that some types are assigned by value and others by reference.

In a quick summary

Primitive types are assigned by value (Boolean, Null, Undefined, Number, String, Symbol (new in ES 6))

Non Primitive types are assigned by reference (Object, Array , Functions)

Example: Primitive types

let a = 1;
let b = a;

console.log(a); // 1
console.log(b); // 1

b = 2;

console.log(a); // 1
console.log(b); // 2

As you can see changing b will not affect a because number is assigned by value.

Example: Non Primitive types

let a = { name: 'Amr' };
let b = a;

console.log(a); // { name: 'Amr' };
console.log(b); // { name: 'Amr' };

b.name = "John";

console.log(a); // { name: 'John' };
console.log(b); // { name: 'John' };

As you can see changing b affected the value of a because it is assigned by reference, this is similar to your example, the issue is not related to delete but it is related to the fact that objects are assigned by reference so deleting key from b will affect a

Cloning:

in some situations you will need to clone your non primitive type object and not mutating the current one, you can do that using the following way:

  1. ES5 var clone = Object.assign({}, obj); OR var clone = JSON.parse(JSON.stringify(obj));

  2. ES6 var clone = { ...obj };

now updating clone will not affect obj

Finally You can read more about this topic in this link it can give you a better understanding on how this works with memory assignment illustrations

Amr Labib
  • 3,995
  • 3
  • 19
  • 31
0

When you do :

let b = a;

You just pass reference of the object a to b. So a and b 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:ref12345−−−+
             |
             |
             |    +−−−−−−−−−−−−−+                 
             +−−−>|  (object)   |                 
             |    +−−−−−−−−−−−−−+                 
             |    | prop1: "a"  |                 
             |    | prop2: "b"  |
b :ref12345−−+    | prop3: "c"  |
                  |             |
                  +−−−−−−−−−−−−−+
amrender singh
  • 7,949
  • 3
  • 22
  • 28
0

Java script array are copied through copy by reference. So if you edit the copied array, the original array will be changed. You can use

let b = a. slice()

Or

Spread operator in ES6. let b = [... a]

stormForce
  • 86
  • 6