diff --git a/snippets/deepMerge.md b/snippets/deepMerge.md new file mode 100644 index 000000000..60a5a987f --- /dev/null +++ b/snippets/deepMerge.md @@ -0,0 +1,27 @@ +--- +title: deepMerge +tags: object,function,advanced +firstSeen: 2021-07-25T05:00:00-04:00 +--- + +Deeply merges two objects, using a function to handle keys present in both. + +- Use `Object.keys()` to get the keys of both objects, create a `Set` from them and use the spread operator (`...`) to create an array of all the unique keys. +- Use `Array.prototype.reduce()` to add each unique key to the object, using `fn` to combine the values of the two given objects. + +```js +const deepMerge = (a, b, fn) => + [...new Set([...Object.keys(a), ...Object.keys(b)])].reduce( + (acc, key) => ({ ...acc, [key]: fn(key, a[key], b[key]) }), + {} + ); +``` + +```js +deepMerge( + { a: true, b: { c: [1, 2, 3] } }, + { a: false, b: { d: [1, 2, 3] } }, + (key, a, b) => (key === 'a' ? a && b : Object.assign({}, a, b)) +); +// { a: false, b: { c: [ 1, 2, 3 ], d: [ 1, 2, 3 ] } } +```