Trong thư viện Lodash , ai đó có thể cung cấp một lời giải thích tốt hơn về hợp nhất và mở rộng / gán .

Đó là một câu hỏi đơn giản nhưng dù sao câu trả lời vẫn lảng tránh tôi.

Dưới đây là cách extend/ assignhoạt động: Đối với mỗi thuộc tính trong nguồn, hãy sao chép giá trị của nó như là đích đến. nếu bản thân các giá trị thuộc tính là các đối tượng, thì không có giao thức đệ quy của các thuộc tính của chúng. Toàn bộ đối tượng sẽ được lấy từ nguồn và đặt vào đích.

Đây là cách mergehoạt động: Đối với mỗi thuộc tính trong nguồn, hãy kiểm tra xem thuộc tính đó có phải là đối tượng không. Nếu đó là đi xuống đệ quy và cố gắng ánh xạ các thuộc tính đối tượng con từ nguồn đến đích. Vì vậy, về cơ bản chúng tôi hợp nhất hệ thống phân cấp đối tượng từ nguồn đến đích. Trong khi cho extend/ assign, nó đơn giản là một bản sao thuộc tính từ nguồn đến đích.

Đây là một JSBin đơn giản sẽ làm cho tinh thể này rõ ràng: http://jsbin.com/uXaqIMa/2/edit?js,console

Đây là phiên bản phức tạp hơn bao gồm cả mảng trong ví dụ: http://jsbin.com/uXaqIMa/1/edit?js,console

Phiên bản tạm thời 3.10.1

Phương pháp so sánh

• _.merge(object, [sources], [customizer], [thisArg])
• _.assign(object, [sources], [customizer], [thisArg])
• _.extend(object, [sources], [customizer], [thisArg])
• _.defaults(object, [sources])
• _.defaultsDeep(object, [sources])

Điểm tương đồng

• Không ai trong số họ làm việc trên mảng như bạn mong đợi
• _.extendlà một bí danh cho _.assign, vì vậy chúng giống hệt nhau
• Tất cả chúng dường như sửa đổi đối tượng đích (đối số đầu tiên)
• Tất cả đều xử lý nullnhư nhau

Sự khác biệt

• _.defaultsvà _.defaultsDeepxử lý các đối số theo thứ tự ngược lại so với các đối số khác (mặc dù đối số đầu tiên vẫn là đối tượng đích)
• _.mergevà _.defaultsDeepsẽ hợp nhất các đối tượng con và các đối tượng khác sẽ ghi đè lên ở cấp gốc
• Chỉ _.assignvà _.extendsẽ ghi đè lên một giá trị vớiundefined

Xét nghiệm

Họ đều xử lý các thành viên ở gốc theo những cách tương tự.

_.assign      ({}, { a: 'a' }, { a: 'bb' }) // => { a: "bb" }
_.merge       ({}, { a: 'a' }, { a: 'bb' }) // => { a: "bb" }
_.defaults    ({}, { a: 'a' }, { a: 'bb' }) // => { a: "a"  }
_.defaultsDeep({}, { a: 'a' }, { a: 'bb' }) // => { a: "a"  }

_.assignxử lý undefinednhưng những người khác sẽ bỏ qua nó

_.assign      ({}, { a: 'a'  }, { a: undefined }) // => { a: undefined }
_.merge       ({}, { a: 'a'  }, { a: undefined }) // => { a: "a" }
_.defaults    ({}, { a: undefined }, { a: 'bb' }) // => { a: "bb" }
_.defaultsDeep({}, { a: undefined }, { a: 'bb' }) // => { a: "bb" }

Tất cả đều xử lý nullnhư nhau

_.assign      ({}, { a: 'a'  }, { a: null }) // => { a: null }
_.merge       ({}, { a: 'a'  }, { a: null }) // => { a: null }
_.defaults    ({}, { a: null }, { a: 'bb' }) // => { a: null }
_.defaultsDeep({}, { a: null }, { a: 'bb' }) // => { a: null }

Nhưng chỉ _.mergevà _.defaultsDeepsẽ hợp nhất các đối tượng con

_.assign      ({}, {a:{a:'a'}}, {a:{b:'bb'}}) // => { "a": { "b": "bb" }}
_.merge       ({}, {a:{a:'a'}}, {a:{b:'bb'}}) // => { "a": { "a": "a", "b": "bb" }}
_.defaults    ({}, {a:{a:'a'}}, {a:{b:'bb'}}) // => { "a": { "a": "a" }}
_.defaultsDeep({}, {a:{a:'a'}}, {a:{b:'bb'}}) // => { "a": { "a": "a", "b": "bb" }}

Và không ai trong số họ sẽ hợp nhất các mảng có vẻ như

_.assign      ({}, {a:['a']}, {a:['bb']}) // => { "a": [ "bb" ] }
_.merge       ({}, {a:['a']}, {a:['bb']}) // => { "a": [ "bb" ] }
_.defaults    ({}, {a:['a']}, {a:['bb']}) // => { "a": [ "a"  ] }
_.defaultsDeep({}, {a:['a']}, {a:['bb']}) // => { "a": [ "a"  ] }

Tất cả sửa đổi đối tượng đích

a={a:'a'}; _.assign      (a, {b:'bb'}); // a => { a: "a", b: "bb" }
a={a:'a'}; _.merge       (a, {b:'bb'}); // a => { a: "a", b: "bb" }
a={a:'a'}; _.defaults    (a, {b:'bb'}); // a => { a: "a", b: "bb" }
a={a:'a'}; _.defaultsDeep(a, {b:'bb'}); // a => { a: "a", b: "bb" }

Không ai thực sự làm việc như mong đợi trên mảng

Lưu ý: Như @Mistic đã chỉ ra, Lodash coi các mảng là các đối tượng trong đó các khóa là chỉ mục vào mảng.

_.assign      ([], ['a'], ['bb']) // => [ "bb" ]
_.merge       ([], ['a'], ['bb']) // => [ "bb" ]
_.defaults    ([], ['a'], ['bb']) // => [ "a"  ]
_.defaultsDeep([], ['a'], ['bb']) // => [ "a"  ]

_.assign      ([], ['a','b'], ['bb']) // => [ "bb", "b" ]
_.merge       ([], ['a','b'], ['bb']) // => [ "bb", "b" ]
_.defaults    ([], ['a','b'], ['bb']) // => [ "a", "b"  ]
_.defaultsDeep([], ['a','b'], ['bb']) // => [ "a", "b"  ]

Một điểm khác biệt cần chú ý là xử lý các undefinedgiá trị:

mergeInto = { a: 1}
toMerge = {a : undefined, b:undefined}
lodash.extend({}, mergeInto, toMerge) // => {a: undefined, b:undefined}
lodash.merge({}, mergeInto, toMerge)  // => {a: 1, b:undefined}

Vì vậy, mergesẽ không hợp nhất undefinedcác giá trị thành các giá trị được xác định.

Nó cũng có thể hữu ích để xem xét những gì họ làm từ quan điểm ngữ nghĩa:

_.chỉ định

   will assign the values of the properties of its second parameter and so on,
   as properties with the same name of the first parameter. (shallow copy & override)

_.merge

   merge is like assign but does not assign objects but replicates them instead.
  (deep copy)

_đặc biệt

   provides default values for missing values.
   so will assign only values for keys that do not exist yet in the source.

_.defaultsDeep

   works like _defaults but like merge will not simply copy objects
   and will use recursion instead.

Tôi tin rằng việc học cách nghĩ về các phương pháp đó theo quan điểm ngữ nghĩa sẽ cho phép bạn "đoán" tốt hơn hành vi của tất cả các kịch bản khác nhau của các giá trị hiện tại và không tồn tại.

Nếu bạn muốn có một bản sao sâu mà không ghi đè trong khi vẫn giữ nguyên objtham chiếu

obj = _.assign(obj, _.merge(obj, [source]))