Deep vs Shallow cloning 2

OBJECT

const original = {
name: ‘John’,
age: 23,
address: {
city: ‘Tashkent’,
state: ‘Oqqorg\’on’,
}
}

SPREAD:

// Spread => Shallow copying
let copiedObj = {…original}
copiedObj.nam…


This content originally appeared on DEV Community and was authored by _Khojiakbar_

OBJECT

const original = {
    name: 'John',
    age: 23,
    address: {
        city: 'Tashkent',
        state: 'Oqqorg\'on',
    }
}

SPREAD:

// Spread => Shallow copying
let copiedObj = {...original}
copiedObj.name = 'Alice'
copiedObj.address.city = 'Samarkand';

console.log(copiedObj.name)
console.log(original.name)

console.log(original.address.city)
console.log(copiedObj.address.city)

// Alice
// John
// Samarkand
// Samarkand

Equal(=):

// = / very shallow copying it is even copying non-nested properties
let copiedObj = original;
copiedObj.name = 'Alice'
copiedObj.address.city = 'Samarkand'

console.log(original.name)
console.log(copiedObj.name)
console.log(original.address.city)
console.log(copiedObj.address.city)

// Alice
// Alice
// Samarkand
// Samarkand

Object.assign():

// Object.assign() => Shallow copy
let copiedObj = Object.assign({}, original)
copiedObj.name = 'Alice';
copiedObj.address.city = 'Samarkand'
console.log(original.name)
console.log(copiedObj.name)
console.log(original.address.city)
console.log(copiedObj.address.city)

// John
// Alice
// Samarkand
// Samarkand

JSON:

// JSON => Deep copy
let copiedObj = JSON.parse(JSON.stringify(original))
copiedObj.name = 'Alice'
copiedObj.address.city = 'Samarkand'

console.log(original.name)
console.log(copiedObj.name)
console.log(original.address.city)
console.log(copiedObj.address.city)

// John
// Alice
// Tashkent
// Samarkand


This content originally appeared on DEV Community and was authored by _Khojiakbar_


Print Share Comment Cite Upload Translate Updates
APA

_Khojiakbar_ | Sciencx (2024-06-17T12:12:12+00:00) Deep vs Shallow cloning 2. Retrieved from https://www.scien.cx/2024/06/17/deep-vs-shallow-cloning-2/

MLA
" » Deep vs Shallow cloning 2." _Khojiakbar_ | Sciencx - Monday June 17, 2024, https://www.scien.cx/2024/06/17/deep-vs-shallow-cloning-2/
HARVARD
_Khojiakbar_ | Sciencx Monday June 17, 2024 » Deep vs Shallow cloning 2., viewed ,<https://www.scien.cx/2024/06/17/deep-vs-shallow-cloning-2/>
VANCOUVER
_Khojiakbar_ | Sciencx - » Deep vs Shallow cloning 2. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2024/06/17/deep-vs-shallow-cloning-2/
CHICAGO
" » Deep vs Shallow cloning 2." _Khojiakbar_ | Sciencx - Accessed . https://www.scien.cx/2024/06/17/deep-vs-shallow-cloning-2/
IEEE
" » Deep vs Shallow cloning 2." _Khojiakbar_ | Sciencx [Online]. Available: https://www.scien.cx/2024/06/17/deep-vs-shallow-cloning-2/. [Accessed: ]
rf:citation
» Deep vs Shallow cloning 2 | _Khojiakbar_ | Sciencx | https://www.scien.cx/2024/06/17/deep-vs-shallow-cloning-2/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.