Cloning arrays and objects

Author: ShubhamSKadam

9_Value_vs_Reference/script.js

@@ -12,14 +12,44 @@
 
 // Cloning Arrays
 // 1st way : Spread Operator
-const numbers = [1, 2, 3, 4];
-const copiedNumbers = numbers;
+// const numbers = [1, 2, 3, 4];
+// const copiedNumbers = numbers;
 
 // Using spread Opeator,
 // Also known as Shallow Cloning
-const newNumbers = [...numbers];
+// const newNumbers = [...numbers];
 
-numbers.push(5);
-console.log(numbers);  // [ 1, 2, 3, 4, 5 ]
-console.log(copiedNumbers); // [ 1, 2, 3, 4, 5 ]
-console.log(newNumbers); // [ 1, 2, 3, 4 ]
+// numbers.push(5);
+// console.log(numbers);  // [ 1, 2, 3, 4, 5 ]
+// console.log(copiedNumbers); // [ 1, 2, 3, 4, 5 ]
+// console.log(newNumbers); // [ 1, 2, 3, 4 ]
+
+// 2nd way : Array.slice()
+// const numbers = [1, 2, 3, 4];
+// const copiedNumbers = numbers;
+
+// Using spread Opeator,
+// Also known as Shallow Cloning
+// const newNumbers = numbers.slice();
+
+// numbers.push(5);
+// console.log(numbers);  // [ 1, 2, 3, 4, 5 ]
+// console.log(copiedNumbers); // [ 1, 2, 3, 4, 5 ]
+// console.log(newNumbers); // [ 1, 2, 3, 4 ]
+
+// Cloning Objects
+// 1st way : Spread Operator
+// const person = { name: "John", age: 22 };
+// const newPerson = { ...person };
+
+// person.age = 23;
+// console.log(person); // { name: 'John', age: 23 }
+// console.log(newPerson); // { name: 'John', age: 22 }
+
+// 2nd way : Object.assign()
+const person = { name: "John", age: 22 };
+const newPerson = Object.assign({},person);
+
+person.age = 23;
+console.log(person); // { name: 'John', age: 23 }
+console.log(newPerson); // { name: 'John', age: 22 }

9_Value_vs_Reference/value_vs_reference.md

@@ -32,5 +32,37 @@ numbers.push(5);
 console.log(numbers);  // [ 1, 2, 3, 4, 5 ]
 console.log(copiedNumbers); // [ 1, 2, 3, 4, 5 ]
 console.log(newNumbers); // [ 1, 2, 3, 4 ]
+
+// 2nd way : Array.slice()
+const numbers = [1, 2, 3, 4];
+const copiedNumbers = numbers;
+
+// Using spread Opeator,
+// Also known as Shallow Cloning
+const newNumbers = numbers.slice();
+
+numbers.push(5);
+console.log(numbers);  // [ 1, 2, 3, 4, 5 ]
+console.log(copiedNumbers); // [ 1, 2, 3, 4, 5 ]
+console.log(newNumbers); // [ 1, 2, 3, 4 ]
+```
+
+```js
+// Cloning Objects
+// 1st way : Spread Operator
+const person = { name: "John", age: 22 };
+const newPerson = { ...person };
+
+person.age = 23;
+console.log(person); // { name: 'John', age: 23 }
+console.log(newPerson); // { name: 'John', age: 22 }
+
+// 2nd way : Object.assign()
+const person = { name: "John", age: 22 };
+const newPerson = Object.assign({},person);
+
+person.age = 23;
+console.log(person); // { name: 'John', age: 23 }
+console.log(newPerson); // { name: 'John', age: 22 }
 ```