Differences between .assignIn(), .assign, .merge(), defaults() and defaultsDeep()

lodash-assignIn-merge-defaults-diff.js

// Tests with Lodash 4.16.4
// Thanks to http://stackoverflow.com/questions/19965844/lodash-difference-between-extend-assign-and-merge

_.assignIn    ({}, { 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' }

  ---

_.assignIn    ({}, { 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' }

  ---

_.assignIn    ({}, {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' } }

  ---

_.assignIn    ({}, {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' ] }

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

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

  ---

// _.assign vs _.assignIn

function Foo() {
  this.a = 1;
}
 
function Bar() {
  this.c = 3;
}
 
Foo.prototype.b = 2;
Bar.prototype.d = 4;
 
_.assignIn({ 'a': 0 }, new Foo, new Bar);
// => { 'a': 1, 'b': 2, 'c': 3, 'd': 4 }
_.assign({ 'a': 0 }, new Foo, new Bar);
// => { 'a': 1, 'c': 3 }

Not all heroes wear capes

This is surprisingly helpful. Thanks!