Object.assign() Method : Object Oriented Programming in JavaScript Series - Part 7

Use Object.assign() Method to copy methods from one object literal to another.

[@dragonniteIV]

Very well explained! No nonsense and just straight to the point. Thank you sir!

[@HakanGalip]

Thanks a lot for this wonderful series.

[@artemipatev9456]

Great tutorials! Thank you so much!!!!

[@velmurugan-jo3vb]

I spend more time in your channel and i suggest to all my colleague about your channel...Thanks man...

[@shivam96sa]

making javascript easy.
learning by examples approach instead of raw theory makes is far better.
excellent content.

[@buncha1499]

techsith you are awesome! Thank you!

[@dubeykivines9202]

Wow nice one

[@Techsithtube]

Thanks for watching

[@garrettbaker2320]

Very informative series..thanks!

[@Techsithtube]

Thanks for watching!:)

[@anaghasalvi8364]

Very useful.Thank you

[@tomcarbon3562]

excellent. Thank You

[@joshrochon6243]

Hey so instead of Toyota you should give the break() method to Ford

[@customdev7078]

u r the champ of JS

[@Techsithtube]

Thanks for nice comment ! )

[@abhiabhang9938]

Hey genius, I implement it ,Its work fine ,Thanks for sharing the videoes.

[@Techsithtube]

:) thanks for watching!

[@debasishkalia135]

Very Useful

[@Techsithtube]

Thanks for watching!

[@swetlinasatpathy4126]

till this video I found the tutorials quite in-depth and easy to understand. Thanks for all your effort and time.
do you have any html5 and reactjs tutorial ?

[@Techsithtube]

Yes I have a full series on react. If you look through my playlist

[@swetlinasatpathy4126]

Found it !! Thanks :)

[@yadusolparterre]

Didn't you forget a return statement in the last function?

[@oonurgulay]

Hi, first of all, I am very thankful for your tutorials, but I am little bit confused about shallow copy explanation. As I know, shallow means not copy of object , it means sharing same local memory and has same reference, so if you change one of them object, other one will be affected. But if you copy object with Object.assign and then you add new method or property to object, the other object will not be affected.
It is like Deep Copy, isn't it?

[@Techsithtube]

Shallow copy means copy one level down . so if you have an deeply nested object. after one level down you are just referencing the object not copying.

[@egorsmirnov452]

@@Techsithtube , I’m struggling with the concept of deep/shallow copy as well, let me make sure that I got this completely clearly: object.assign copies properties from one object literal to another; It does so in a manner of FULL COPY or CLONE so two objects are independent and you can change one object ant this change will not affect the other object; UNLESS you are copying object’s properties that are MORE THAN ONE LAYER DEEP in which case deeper proprties will be passed by reference, they will have a common source and changing one object will result in changing both. Is everything correct in this description?

[@saeeduchiha5537]

@@egorsmirnov452 one-level copy means only primitive data types will be deep-copied. The composite (none primitive) data types (e.g arrays and objects) are shallow-copied (aka by pointer/reference only)

[@mykolavoinikov4981]

Is it a good practice to use Object.assign method in constructor?

[@Techsithtube]

As long as your bowser supports Object.assign you should use it .

[@Atif1702]

Hello, you said that prototype methods don't get copied but I tried the below code and type() method is in both objects, vitz and toyota.
Why is that so? It should not be present in vitz object, right?
let toyota = {
drive() {
return 'driving toyota';
}
};
toyota.prototype = {
type() {
return 'Sedan';
}
}
let vitz = Object.assign({}, toyota);
console.dir(vitz);
console.dir(toyota);

[@Techsithtube]

what you see is an illusion you cant add the prototype to an object literal like this. its meant for constructors (functions) . the right syntax would be
let toyota = {
drive() {
return 'driving toyota';
}
};
Object.setPrototypeOf(toyota, {
type: function() {
return 'Sedan';
}
})
let vitz = Object.assign({}, toyota);
console.dir(vitz);
console.dir(toyota);

[@Atif1702]

Oh yes, Thank you so much for pointing out the mistake and clearing the concept.

[@biikaaa.6540]

i dont understand the last part

[@jainshilpi3]

Can u pls exaplain shallow and deep copy in little detail?

[@Techsithtube]

Shallow means a copy of the object and its methods. a deep copy will include not only object data but its prototype properties as well. got it?

[@jainshilpi3]

yes got ..thanku so much

[@whome1319]

I thought in objects it needed to be drive: function(){},

[@Techsithtube]

in the ES6/ES2015 you can use drive(){}

[@whome1319]

techsith thanks

[@jerryrincon9846]

Is this advanced JAVASCRIPT

[@Techsithtube]

it's not advance javaScript. but most of the people don't use it.

[@baturalkan2959]

4:00 , actually Object.assign() doesnt make the shallow copy, instead makes the deep copy with below exception, please check this MDN example;
(If the source value is a reference to an object, it only copies the reference value.)
let obj1 = { a: 0 , b: { c: 0}};
let obj2 = Object.assign({}, obj1);
console.log(JSON.stringify(obj2)); // { "a": 0, "b": { "c": 0}}
obj1.a = 1;
console.log(JSON.stringify(obj1)); // { "a": 1, "b": { "c": 0}}
console.log(JSON.stringify(obj2)); // { "a": 0, "b": { "c": 0}}
obj2.a = 2;
console.log(JSON.stringify(obj1)); // { "a": 1, "b": { "c": 0}}
console.log(JSON.stringify(obj2)); // { "a": 2, "b": { "c": 0}}
obj2.b.c = 3;
console.log(JSON.stringify(obj1)); // { "a": 1, "b": { "c": 3}}
console.log(JSON.stringify(obj2)); // { "a": 2, "b": { "c": 3}}

[@Techsithtube]

That is consider as a shallow copy. THat is why your last example has the same C value. Deep copy will create copy of everything.

[@baturalkan2959]

@@Techsithtube Shallow copy of every prop individually not the obj itself, got you thanks

[@martinbozinovski]

check this out..
object.assign( [ ], obj ). Magic :). Not a shallow copy right? Or am i just writing rubbish?

[@Techsithtube]

Its is a shallow copy of Obj.