[d24f17c] | 1 | # deepmerge
|
---|
| 2 |
|
---|
| 3 | Merges the enumerable properties of two or more objects deeply.
|
---|
| 4 |
|
---|
| 5 | > UMD bundle is 723B minified+gzipped
|
---|
| 6 |
|
---|
| 7 | ## Getting Started
|
---|
| 8 |
|
---|
| 9 | ### Example Usage
|
---|
| 10 | <!--js
|
---|
| 11 | const merge = require('./')
|
---|
| 12 | -->
|
---|
| 13 |
|
---|
| 14 | ```js
|
---|
| 15 | const x = {
|
---|
| 16 | foo: { bar: 3 },
|
---|
| 17 | array: [{
|
---|
| 18 | does: 'work',
|
---|
| 19 | too: [ 1, 2, 3 ]
|
---|
| 20 | }]
|
---|
| 21 | }
|
---|
| 22 |
|
---|
| 23 | const y = {
|
---|
| 24 | foo: { baz: 4 },
|
---|
| 25 | quux: 5,
|
---|
| 26 | array: [{
|
---|
| 27 | does: 'work',
|
---|
| 28 | too: [ 4, 5, 6 ]
|
---|
| 29 | }, {
|
---|
| 30 | really: 'yes'
|
---|
| 31 | }]
|
---|
| 32 | }
|
---|
| 33 |
|
---|
| 34 | const output = {
|
---|
| 35 | foo: {
|
---|
| 36 | bar: 3,
|
---|
| 37 | baz: 4
|
---|
| 38 | },
|
---|
| 39 | array: [{
|
---|
| 40 | does: 'work',
|
---|
| 41 | too: [ 1, 2, 3 ]
|
---|
| 42 | }, {
|
---|
| 43 | does: 'work',
|
---|
| 44 | too: [ 4, 5, 6 ]
|
---|
| 45 | }, {
|
---|
| 46 | really: 'yes'
|
---|
| 47 | }],
|
---|
| 48 | quux: 5
|
---|
| 49 | }
|
---|
| 50 |
|
---|
| 51 | merge(x, y) // => output
|
---|
| 52 | ```
|
---|
| 53 |
|
---|
| 54 |
|
---|
| 55 | ### Installation
|
---|
| 56 |
|
---|
| 57 | With [npm](http://npmjs.org) do:
|
---|
| 58 |
|
---|
| 59 | ```sh
|
---|
| 60 | npm install deepmerge
|
---|
| 61 | ```
|
---|
| 62 |
|
---|
| 63 | deepmerge can be used directly in the browser without the use of package managers/bundlers as well: [UMD version from unpkg.com](https://unpkg.com/deepmerge/dist/umd.js).
|
---|
| 64 |
|
---|
| 65 |
|
---|
| 66 | ### Include
|
---|
| 67 |
|
---|
| 68 | deepmerge exposes a CommonJS entry point:
|
---|
| 69 |
|
---|
| 70 | ```
|
---|
| 71 | const merge = require('deepmerge')
|
---|
| 72 | ```
|
---|
| 73 |
|
---|
| 74 | The ESM entry point was dropped due to a [Webpack bug](https://github.com/webpack/webpack/issues/6584).
|
---|
| 75 |
|
---|
| 76 | # API
|
---|
| 77 |
|
---|
| 78 |
|
---|
| 79 | ## `merge(x, y, [options])`
|
---|
| 80 |
|
---|
| 81 | Merge two objects `x` and `y` deeply, returning a new merged object with the
|
---|
| 82 | elements from both `x` and `y`.
|
---|
| 83 |
|
---|
| 84 | If an element at the same key is present for both `x` and `y`, the value from
|
---|
| 85 | `y` will appear in the result.
|
---|
| 86 |
|
---|
| 87 | Merging creates a new object, so that neither `x` or `y` is modified.
|
---|
| 88 |
|
---|
| 89 | **Note:** By default, arrays are merged by concatenating them.
|
---|
| 90 |
|
---|
| 91 | ## `merge.all(arrayOfObjects, [options])`
|
---|
| 92 |
|
---|
| 93 | Merges any number of objects into a single result object.
|
---|
| 94 |
|
---|
| 95 | ```js
|
---|
| 96 | const foobar = { foo: { bar: 3 } }
|
---|
| 97 | const foobaz = { foo: { baz: 4 } }
|
---|
| 98 | const bar = { bar: 'yay!' }
|
---|
| 99 |
|
---|
| 100 | merge.all([ foobar, foobaz, bar ]) // => { foo: { bar: 3, baz: 4 }, bar: 'yay!' }
|
---|
| 101 | ```
|
---|
| 102 |
|
---|
| 103 |
|
---|
| 104 | ## Options
|
---|
| 105 |
|
---|
| 106 | ### `arrayMerge`
|
---|
| 107 |
|
---|
| 108 | There are multiple ways to merge two arrays, below are a few examples but you can also create your own custom function.
|
---|
| 109 |
|
---|
| 110 | Your `arrayMerge` function will be called with three arguments: a `target` array, the `source` array, and an `options` object with these properties:
|
---|
| 111 |
|
---|
| 112 | - `isMergeableObject(value)`
|
---|
| 113 | - `cloneUnlessOtherwiseSpecified(value, options)`
|
---|
| 114 |
|
---|
| 115 | #### `arrayMerge` example: overwrite target array
|
---|
| 116 |
|
---|
| 117 | Overwrites the existing array values completely rather than concatenating them:
|
---|
| 118 |
|
---|
| 119 | ```js
|
---|
| 120 | const overwriteMerge = (destinationArray, sourceArray, options) => sourceArray
|
---|
| 121 |
|
---|
| 122 | merge(
|
---|
| 123 | [1, 2, 3],
|
---|
| 124 | [3, 2, 1],
|
---|
| 125 | { arrayMerge: overwriteMerge }
|
---|
| 126 | ) // => [3, 2, 1]
|
---|
| 127 | ```
|
---|
| 128 |
|
---|
| 129 | #### `arrayMerge` example: combine arrays
|
---|
| 130 |
|
---|
| 131 | Combines objects at the same index in the two arrays.
|
---|
| 132 |
|
---|
| 133 | This was the default array merging algorithm pre-version-2.0.0.
|
---|
| 134 |
|
---|
| 135 | ```js
|
---|
| 136 | const combineMerge = (target, source, options) => {
|
---|
| 137 | const destination = target.slice()
|
---|
| 138 |
|
---|
| 139 | source.forEach((item, index) => {
|
---|
| 140 | if (typeof destination[index] === 'undefined') {
|
---|
| 141 | destination[index] = options.cloneUnlessOtherwiseSpecified(item, options)
|
---|
| 142 | } else if (options.isMergeableObject(item)) {
|
---|
| 143 | destination[index] = merge(target[index], item, options)
|
---|
| 144 | } else if (target.indexOf(item) === -1) {
|
---|
| 145 | destination.push(item)
|
---|
| 146 | }
|
---|
| 147 | })
|
---|
| 148 | return destination
|
---|
| 149 | }
|
---|
| 150 |
|
---|
| 151 | merge(
|
---|
| 152 | [{ a: true }],
|
---|
| 153 | [{ b: true }, 'ah yup'],
|
---|
| 154 | { arrayMerge: combineMerge }
|
---|
| 155 | ) // => [{ a: true, b: true }, 'ah yup']
|
---|
| 156 | ```
|
---|
| 157 |
|
---|
| 158 | ### `isMergeableObject`
|
---|
| 159 |
|
---|
| 160 | By default, deepmerge clones every property from almost every kind of object.
|
---|
| 161 |
|
---|
| 162 | You may not want this, if your objects are of special types, and you want to copy the whole object instead of just copying its properties.
|
---|
| 163 |
|
---|
| 164 | You can accomplish this by passing in a function for the `isMergeableObject` option.
|
---|
| 165 |
|
---|
| 166 | If you only want to clone properties of plain objects, and ignore all "special" kinds of instantiated objects, you probably want to drop in [`is-plain-object`](https://github.com/jonschlinkert/is-plain-object).
|
---|
| 167 |
|
---|
| 168 | ```js
|
---|
| 169 | const { isPlainObject } = require('is-plain-object')
|
---|
| 170 |
|
---|
| 171 | function SuperSpecial() {
|
---|
| 172 | this.special = 'oh yeah man totally'
|
---|
| 173 | }
|
---|
| 174 |
|
---|
| 175 | const instantiatedSpecialObject = new SuperSpecial()
|
---|
| 176 |
|
---|
| 177 | const target = {
|
---|
| 178 | someProperty: {
|
---|
| 179 | cool: 'oh for sure'
|
---|
| 180 | }
|
---|
| 181 | }
|
---|
| 182 |
|
---|
| 183 | const source = {
|
---|
| 184 | someProperty: instantiatedSpecialObject
|
---|
| 185 | }
|
---|
| 186 |
|
---|
| 187 | const defaultOutput = merge(target, source)
|
---|
| 188 |
|
---|
| 189 | defaultOutput.someProperty.cool // => 'oh for sure'
|
---|
| 190 | defaultOutput.someProperty.special // => 'oh yeah man totally'
|
---|
| 191 | defaultOutput.someProperty instanceof SuperSpecial // => false
|
---|
| 192 |
|
---|
| 193 | const customMergeOutput = merge(target, source, {
|
---|
| 194 | isMergeableObject: isPlainObject
|
---|
| 195 | })
|
---|
| 196 |
|
---|
| 197 | customMergeOutput.someProperty.cool // => undefined
|
---|
| 198 | customMergeOutput.someProperty.special // => 'oh yeah man totally'
|
---|
| 199 | customMergeOutput.someProperty instanceof SuperSpecial // => true
|
---|
| 200 | ```
|
---|
| 201 |
|
---|
| 202 | ### `customMerge`
|
---|
| 203 |
|
---|
| 204 | Specifies a function which can be used to override the default merge behavior for a property, based on the property name.
|
---|
| 205 |
|
---|
| 206 | The `customMerge` function will be passed the key for each property, and should return the function which should be used to merge the values for that property.
|
---|
| 207 |
|
---|
| 208 | It may also return undefined, in which case the default merge behaviour will be used.
|
---|
| 209 |
|
---|
| 210 | ```js
|
---|
| 211 | const alex = {
|
---|
| 212 | name: {
|
---|
| 213 | first: 'Alex',
|
---|
| 214 | last: 'Alexson'
|
---|
| 215 | },
|
---|
| 216 | pets: ['Cat', 'Parrot']
|
---|
| 217 | }
|
---|
| 218 |
|
---|
| 219 | const tony = {
|
---|
| 220 | name: {
|
---|
| 221 | first: 'Tony',
|
---|
| 222 | last: 'Tonison'
|
---|
| 223 | },
|
---|
| 224 | pets: ['Dog']
|
---|
| 225 | }
|
---|
| 226 |
|
---|
| 227 | const mergeNames = (nameA, nameB) => `${nameA.first} and ${nameB.first}`
|
---|
| 228 |
|
---|
| 229 | const options = {
|
---|
| 230 | customMerge: (key) => {
|
---|
| 231 | if (key === 'name') {
|
---|
| 232 | return mergeNames
|
---|
| 233 | }
|
---|
| 234 | }
|
---|
| 235 | }
|
---|
| 236 |
|
---|
| 237 | const result = merge(alex, tony, options)
|
---|
| 238 |
|
---|
| 239 | result.name // => 'Alex and Tony'
|
---|
| 240 | result.pets // => ['Cat', 'Parrot', 'Dog']
|
---|
| 241 | ```
|
---|
| 242 |
|
---|
| 243 |
|
---|
| 244 | ### `clone`
|
---|
| 245 |
|
---|
| 246 | *Deprecated.*
|
---|
| 247 |
|
---|
| 248 | Defaults to `true`.
|
---|
| 249 |
|
---|
| 250 | If `clone` is `false` then child objects will be copied directly instead of being cloned. This was the default behavior before version 2.x.
|
---|
| 251 |
|
---|
| 252 |
|
---|
| 253 | # Testing
|
---|
| 254 |
|
---|
| 255 | With [npm](http://npmjs.org) do:
|
---|
| 256 |
|
---|
| 257 | ```sh
|
---|
| 258 | npm test
|
---|
| 259 | ```
|
---|
| 260 |
|
---|
| 261 |
|
---|
| 262 | # License
|
---|
| 263 |
|
---|
| 264 | MIT
|
---|