The difference between assign,extend and merge in Lodash

Brief Introduction

We often see the assign,extend,merge function in someone else's code, which is similar to the three functions that merge the properties of the source object into the target object.

Since all are merging objects, why are there three different functions? What is the difference between them? assign (object, [sources])

Let's look at the definition on the official website first:

Assigns own enumerable string keyed properties of source objects to the destination object. Source objects are applied from left to right. Subsequent sources overwrite property assignments of previous sources.

The properties of the source object (sources) are assigned to the target object, and the source object is called from left to right, and the properties of the following object are overwritten by the preceding.

Take a look at the following example:

Assign ({}, {a:1}, {b:2}); {a:1, B:2}//later {a:2} covers assign ({}, {a:1}, {b:2}, {a:2}) to the previous {a:1}; {a:2, B:2}//Observe the following two examples, if the property value is object, the following value overrides the preceding value assign ({}, {a:1}, {b: {c:2, D:3}})//{a:1, B: {C:2 , D:3}} assign ({}, {a:1}, {b: {c:2, D:3}}, {b: {e:4}})//{a:1, B: {e:4}}//' Assign ' function ignores the genus on the prototype chain Of function Foo () {this.c = 3;} FOO.PROTOTYPE.D = 4; Assign ({a:1}, new Foo ()); {a:1, C:3}//' Assign ' will modify the original object var test = {A:1}; Assign (test, {b:2}); {a:1, b:2} console.log (test); {a:1, b:2}

extend (object, [sources])

In the 3.x version, Extend is an alias for assign, and they work exactly the same.
In the 4.x version, Extend is a assignin alias, and assign a little different.

The official definition is as follows:

This are like _.assign except the IT iterates over own and inherited source properties.

In the above example, we know that the Assign function does not merge attributes from the prototype chain into the target object, whereas the extend or assignin functions.

Important!! This is Lodash 4.x!! The attributes on the source object prototype chain are also merged onto the target object. function Foo () {this.c = 3;} FOO.PROTOTYPE.D = 4; Extend ({a:1}, new Foo ()); {a:1, c:3, D:4}

Merge (object, [sources])

Let's look at the definition of the merge function:

This are like _.assign except that it recursively merges own and inherited enumerable string keyed properties of SOU RCE objects into the destination object. Source properties that resolve to undefined are skipped if a destination value exists. Array and plain object properties are merged recursively. Other objects and value types are overridden by assignment. Source objects are applied from left to right. Subsequent sources overwrite property assignments of previous sources.

The merge is similar to assign, except that when the merge encounters the same attributes, if the property value is a pure object (plain object) or a collection (collection), instead of overwriting the previous attribute value with the subsequent attribute value, the two property values are merged.
If the property value of the source object is undefined, the property is ignored.

Assign ({}, {a:1}, {b: {c:2, D:3}}, {b: {e:4}})//{a:1, B: {e:4}} merge ({}, {a:1}, {b: {c:2, D : 3}}, {b: {e:4}})//{a:1, B: {c:2, D:3, E:4}}//merge collection var users = {' data ': [{' User ': ' Barney '}, {' Use ' R ': ' Fred '}]}; var ages = {' data ': [{' Age ': +}, {' Age ': 40}]}; Merge ({}, users, ages)//{data: [{User: ' Barney ', age:36}, {User: ' Fred ', Age:40}]}//The merge function modifies the original object. Merge (Users, ages) Console.log (users)/{data: [{User: ' Barney ', age:36}, {User: ' Fred ', age:40}]

Summary In the same placeCan be used to merge objects will modify the original object (if the original object is the first argument as a function) the Difference

The Assign function does not process attributes on the prototype chain, nor does it merge the same attributes, but overwrites the previous property values with the following attribute values

Extend the attributes on the prototype chain will be merged in the 3.x version and the Assign 4.x version

When the merge encounters the same property name, the property value reference is merged if the property value is a pure object or collection

Https://lodash.com/docs
Http://stackoverflow.com/questions/19965844/lodash-difference-between-extend-assign-and-merge

Original link: https://scarletsky.github.io/2016/04/02/assign-vs-extend-vs-merge-in-lodash/