En la biblioteca de Lodash , ¿alguien puede proporcionar una mejor explicación de fusión y extensión / asignación .
Es una pregunta simple pero la respuesta me evade.
En la biblioteca de Lodash , ¿alguien puede proporcionar una mejor explicación de fusión y extensión / asignación .
Es una pregunta simple pero la respuesta me evade.
Respuestas:
Aquí se explica cómo extend
/ assign
funciona: para cada propiedad en el origen, copie su valor tal cual al destino. Si los valores de propiedad en sí mismos son objetos, no existe un recorrido recursivo de sus propiedades. Todo el objeto se tomaría del origen y se establecería en el destino.
Así es como merge
funciona: para cada propiedad en la fuente, verifique si esa propiedad es el objeto mismo. Si es así, baje de forma recursiva e intente asignar propiedades de objetos secundarios desde el origen al destino. Entonces, esencialmente fusionamos la jerarquía de objetos de origen a destino. Mientras que para extend
/ assign
, es una copia simple de un nivel de propiedades desde el origen hasta el destino.
Aquí hay un JSBin simple que aclararía esto: http://jsbin.com/uXaqIMa/2/edit?js,console
Aquí hay una versión más elaborada que incluye una matriz en el ejemplo también: http://jsbin.com/uXaqIMa/1/edit?js,console
var combined = merge({}, src, dest)
_.merge(object, [sources], [customizer], [thisArg])
_.assign(object, [sources], [customizer], [thisArg])
_.extend(object, [sources], [customizer], [thisArg])
_.defaults(object, [sources])
_.defaultsDeep(object, [sources])
_.extend
es un alias para _.assign
, lo que son idénticosnull
lo mismo_.defaults
y _.defaultsDeep
procesa los argumentos en orden inverso en comparación con los demás (aunque el primer argumento sigue siendo el objeto de destino)_.merge
y _.defaultsDeep
fusionará objetos secundarios y los demás se sobrescribirán en el nivel raíz_.assign
y _.extend
sobrescribirá un valor conundefined
_.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" }
_.assign
maneja undefined
pero los demás lo omitirá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" }
null
lo mismo_.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 }
_.merge
y _.defaultsDeep
fusionará objetos secundarios_.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" }}
_.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" ] }
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" }
Nota: Como señaló @Mistic, Lodash trata las matrices como objetos donde las claves son el índice de la matriz.
_.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" ]
_.extend is an alias for _.assign, so they are identical
conflictos conOnly _.assign will overwrite a value with undefined
Otra diferencia a la que prestar atención es el manejo de undefined
valores:
mergeInto = { a: 1}
toMerge = {a : undefined, b:undefined}
lodash.extend({}, mergeInto, toMerge) // => {a: undefined, b:undefined}
lodash.merge({}, mergeInto, toMerge) // => {a: 1, b:undefined}
Por merge
lo tanto , no fusionará undefined
valores en valores definidos.
mergeInto
tuviera propiedades que toMerge
no tuvieran, entonces retendría esas propiedades. En ese caso no sería un clon.
También podría ser útil considerar lo que hacen desde un punto de vista semántico:
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 is like assign but does not assign objects but replicates them instead.
(deep copy)
provides default values for missing values.
so will assign only values for keys that do not exist yet in the source.
works like _defaults but like merge will not simply copy objects
and will use recursion instead.
Creo que aprender a pensar en esos métodos desde el punto de vista semántico le permitiría "adivinar" mejor cuál sería el comportamiento para todos los diferentes escenarios de valores existentes y no existentes.