3 Ways To Copy Objects in JavaScript (Spread, Assign & JSON)
ฝัง
- เผยแพร่เมื่อ 28 พ.ย. 2024
- In this video I'll show you 3 different techniques to copy objects in JavaScript. These techniques will work on Node.js or in the browser:
spread syntax
using the Object assign method
using JSON parse and stringify
For your reference, check this out:
developer.mozi...
developer.mozi...
developer.mozi...
🏫 My Udemy Courses - www.udemy.com/...
🎨 Download my VS Code theme - marketplace.vi...
💜 Join my Discord Server - / discord
🐦 Find me on Twitter - / dcodeyt
💸 Support me on Patreon - / dcode
📰 Follow me on DEV Community - dev.to/dcodeyt
📹 Join this channel to get access to perks - / @dcode-software
If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
#dcode #javascript
Fourth Way:
const myDeepCopy = structuredClone(myOriginal);
Structured cloning addresses many (although not all) shortcomings of the JSON.stringify() technique. Structured cloning can handle cyclical data structures, support many built-in data types and is generally more robust and often faster.
However, it still has some limitations that may catch you off-guard:
Prototypes: If you use structuredClone() with a class instance, you’ll get a plain object as the return value, as structured cloning discards the object’s prototype chain.
Functions: If your object contains functions, they will be quietly discarded.
Non-cloneables: Some values are not structured cloneable, most notably Error and DOM nodes. It will cause structuredClone() to throw.
To get out of that hairy situation with spread is to have another spread inside.
e.g:
const copiedUser = { ...user, friends: [....user.friends] };
With this, we'll create a copy of the friends array as well
So if you then insert a new friend in the main user
user.friends.push('dom')
it will not appear in the array of friends of the copiedUser
user.friends: ["Matt", "Ange", "Johhny", "dom"]
copiedUser.friends: ["Matt", "Ange", "Johhny"]
brilliant!
Can u do any real time projects in JavaScript
Great explanation!
Hello, very nice, I like your videos. Here master JS fullstack developer.. I would like to start a server using rust programming language but there are very few videos for this topic. I saw u already made some rust tutorials... I watched them all. could you do more about creating web server using rust ? If someone interesting as well please like the comment ...
Awesome!!
When I find myself in times of trouble
Dom's videos come to me
Speaking words of wisdom
Spread Ass▓▓▓ ▓SON
really a great helpful video , sir can you make a video on javascript fullpage vertical scoll similar to fullpage js like in vanilla js
thanx
No worries
Deep copy via JSON is a really bad idea. As you mentioned it will not work for Date and basically any other complex type because in that way we copy only data and loose completely information about type/prototype and also we have problem with conversion to/from string.
So how to solve this problem of many nested objects?
Tut on Buttercake css framework?
1.(...user) ;
2.Object.assign((), user) ;
3.JSON.pare(JSON.stringify(user)) ;
Which one is the best for developer
...
🙏🙏🙏🙏👌👌👌👌🖖🖖🖖🖖🖖