Skip to main content
Fomateo general de la respuesta intentando beneficiar la legibilidad.
Origen Enlace
Mariano
  • 24.5k
  • 20
  • 76
  • 105

De la documentación de JQuery:

$.extend( target, obj1, [ obj2 ] ) -> añade el contenido de los obj1, obj2, al target, y devuelve este último.

De la documentación de jQuery:

$.extend( target, obj1, \[ obj2 \] )
Añade el contenido de los obj1, obj2, al target, y devuelve este último.

Es decir, que el comportamiento correcto y esperado es el que tú das por erróneo. Lo raro es el primer caso, que según dices, no hace lo mismo.

¿ Seguro.. ¿Seguro que en el primer caso que expones, ambosambos, jTemp y jDef, no terminan con los mismos atributos  ?

Si lo que quieres es añadir un atributo a un objeto ya creado, es tan fácil como hacer una simple asignación.

Si lo que quieres es obtener un objeto que mezcle otros 2, sería:

  • Si lo que quieres es añadir un atributo a un objeto ya creado, es tan fácil como hacer una simple asignación.

  • Si lo que quieres es obtener un objeto que mezcle otros 2, sería:

      result = $.extend( { }, obj1, obj2 }
    
result = $.extend( { }, obj1, obj2 }
 

EDITO

 

Explicación del último punto:

### Descripción

$.extend( ) extendiendeextiende el objeto pasado como primer argumento con los atributos de los otros 2objetos, y devuelve ese primer argumento. Como le pasamos un objeto vacío, sin contenido previo, copia el contenido de los otros 2 objetos sobre ese objeto vacio; al finalizar, target contiene todos los atributos contenidos en los otros 2, que no han sido modificados.

PolPor último, $.extend( ) nos devuelve el objeto que le pasamos como primer argumento (recordemos que los objetos se pasan por referencia), con lo que ya tenemos nuestra operacion union realizada.

EDITO 2

 

Veamos tu nuevo código de muestra:

### Ejemplo:
function obtenerBBDD() {
    return [{cod: 1, desc: '111'}, {cod: 2, desc: '222'}];
}

var jDef = {id: 'hola', valores: obtenerBBDD()};
// jDef = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222"}]}

var jTemp = $.extend({ },  jDef);
// jTemp = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222","selected":true}]}
function obtenerBBDD() {
    return [{cod: 1, desc: '111'}, {cod: 2, desc: '222'}];
}

var jDef = {id: 'hola', valores: obtenerBBDD()};
// jDef = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222"}]}

var jTemp = $.extend({ },  jDef);
// jTemp = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222","selected":true}]}

Es este justo momentodecir, jTemp.valoresjTemp.valores es el mismo objeto que jDef.valoresjDef.valores.

A partir de ahí Por lo tanto, cualquier cambio a uno de ellos afecta al otro.

POSIBLES SOLUCIONESPosibles soluciones

  1. Usar $.extend( ) con un argumento true inicial, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

  2. Usar otra librería, que si realice un deep copy, si jquery no lo permite.

    var jTemp = $.extend( true, { }, jDef )
    

Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

  1. Usar otra librería, que sí realice un deep copy, si jQuery no lo permite.

De la documentación de JQuery:

$.extend( target, obj1, [ obj2 ] ) -> añade el contenido de los obj1, obj2, al target, y devuelve este último.

Es decir, que el comportamiento correcto y esperado es el que tú das por erróneo. Lo raro es el primer caso, que según dices, no hace lo mismo.

¿ Seguro que en el primer caso que expones, ambos, jTemp y jDef, no terminan con los mismos atributos  ?

Si lo que quieres es añadir un atributo a un objeto ya creado, es tan fácil como hacer una simple asignación.

Si lo que quieres es obtener un objeto que mezcle otros 2, sería:

result = $.extend( { }, obj1, obj2 }

EDITO

Explicación del último punto:

$.extend( ) extendiende el primer argumento con los atributos de los otros 2, y devuelve ese primer argumento. Como le pasamos un objeto vacío, sin contenido previo, copia el contenido de los otros 2 objetos sobre ese objeto vacio; al finalizar, target contiene todos los atributos contenidos en los otros 2, que no han sido modificados.

Pol último, $.extend( ) nos devuelve el objeto que le pasamos como primer argumento (recordemos que los objetos se pasan por referencia), con lo que ya tenemos nuestra operacion union realizada.

EDITO 2

Veamos tu nuevo código de muestra:

function obtenerBBDD() {
    return [{cod: 1, desc: '111'}, {cod: 2, desc: '222'}];
}

var jDef = {id: 'hola', valores: obtenerBBDD()};
// jDef = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222"}]}

var jTemp = $.extend({ },  jDef);
// jTemp = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222","selected":true}]}

Es este justo momento, jTemp.valores es el mismo objeto que jDef.valores.

A partir de ahí, cualquier cambio a uno de ellos afecta al otro.

POSIBLES SOLUCIONES

  1. Usar $.extend( ) con un argumento true inicial, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

  2. Usar otra librería, que si realice un deep copy, si jquery no lo permite.

De la documentación de jQuery:

$.extend( target, obj1, \[ obj2 \] )
Añade el contenido de los obj1, obj2, al target, y devuelve este último.

Es decir, que el comportamiento correcto y esperado es el que tú das por erróneo. Lo raro es el primer caso, que según dices, no hace lo mismo... ¿Seguro que en el primer caso que expones, ambos, jTemp y jDef, no terminan con los mismos atributos?

  • Si lo que quieres es añadir un atributo a un objeto ya creado, es tan fácil como hacer una simple asignación.

  • Si lo que quieres es obtener un objeto que mezcle otros 2, sería:

      result = $.extend( { }, obj1, obj2 }
    
 
 
### Descripción

$.extend( ) extiende el objeto pasado como primer argumento con los atributos de los otros objetos, y devuelve ese primer argumento. Como le pasamos un objeto vacío, sin contenido previo, copia el contenido de los otros 2 objetos sobre ese objeto vacio; al finalizar, target contiene todos los atributos contenidos en los otros 2, que no han sido modificados.

Por último, $.extend( ) nos devuelve el objeto que le pasamos como primer argumento (recordemos que los objetos se pasan por referencia), con lo que ya tenemos nuestra operacion union realizada.

 
### Ejemplo:
function obtenerBBDD() {
    return [{cod: 1, desc: '111'}, {cod: 2, desc: '222'}];
}

var jDef = {id: 'hola', valores: obtenerBBDD()};
// jDef = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222"}]}

var jTemp = $.extend({ },  jDef);
// jTemp = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222","selected":true}]}

Es decir, jTemp.valores es el mismo objeto que jDef.valores. Por lo tanto, cualquier cambio a uno de ellos afecta al otro.

Posibles soluciones

  1. Usar $.extend( ) con un argumento true inicial, para que haga una copia recursiva:

    var jTemp = $.extend( true, { }, jDef )
    

Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

  1. Usar otra librería, que sí realice un deep copy, si jQuery no lo permite.
se añadieron 101 caracteres en el cuerpo
Origen Enlace
Trauma
  • 26.9k
  • 5
  • 42
  • 68

SOLUCIONPOSIBLES SOLUCIONES

  1. Usar $.extend( ) con 4 parámetros, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

    Usar $.extend( ) con un argumento true inicial, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

  2. Usar otra librería, que si realice un deep copy, si jquery no lo permite.

SOLUCION

  1. Usar $.extend( ) con 4 parámetros, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

POSIBLES SOLUCIONES

  1. Usar $.extend( ) con un argumento true inicial, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

  2. Usar otra librería, que si realice un deep copy, si jquery no lo permite.

se añadieron 1032 caracteres en el cuerpo
Origen Enlace
Trauma
  • 26.9k
  • 5
  • 42
  • 68

De la documentación de JQuery:

$.extend( target, obj1, [ obj2 ] ) -> añade el contenido de los obj1, obj2, al target, y devuelve este último.

Es decir, que el comportamiento correcto y esperado es el que tú das por erróneo. Lo raro es el primer caso, que según dices, no hace lo mismo.

¿ Seguro que en el primer caso que expones, ambos, jTemp y jDef, no terminan con los mismos atributos ?

Si lo que quieres es añadir un atributo a un objeto ya creado, es tan fácil como hacer una simple asignación.

Si lo que quieres es obtener un objeto que mezcle otros 2, sería:

result = $.extend( { }, obj1, obj2 }

EDITO

Explicación del último punto:

$.extend( ) extendiende el primer argumento con los atributos de los otros 2, y devuelve ese primer argumento. Como le pasamos un objeto vacío, sin contenido previo, copia el contenido de los otros 2 objetos sobre ese objeto vacio; al finalizar, target contiene todos los atributos contenidos en los otros 2, que no han sido modificados.

Pol último, $.extend( ) nos devuelve el objeto que le pasamos como primer argumento (recordemos que los objetos se pasan por referencia), con lo que ya tenemos nuestra operacion union realizada.

EDITO 2

Veamos tu nuevo código de muestra:

function obtenerBBDD() {
    return [{cod: 1, desc: '111'}, {cod: 2, desc: '222'}];
}

var jDef = {id: 'hola', valores: obtenerBBDD()};
// jDef = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222"}]}

var jTemp = $.extend({ },  jDef);
// jTemp = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222","selected":true}]}

Aqui empezamos con los problemas. jTemp["valores"] no es un objeto independiente, es una referencia al "valores" contenido en jDef.

Es este justo momento, jTemp.valores es el mismo objeto que jDef.valores.

A partir de ahí, cualquier cambio a uno de ellos afecta al otro.

SOLUCION

  1. Usar $.extend( ) con 4 parámetros, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.

De la documentación de JQuery:

$.extend( target, obj1, [ obj2 ] ) -> añade el contenido de los obj1, obj2, al target, y devuelve este último.

Es decir, que el comportamiento correcto y esperado es el que tú das por erróneo. Lo raro es el primer caso, que según dices, no hace lo mismo.

¿ Seguro que en el primer caso que expones, ambos, jTemp y jDef, no terminan con los mismos atributos ?

Si lo que quieres es añadir un atributo a un objeto ya creado, es tan fácil como hacer una simple asignación.

Si lo que quieres es obtener un objeto que mezcle otros 2, sería:

result = $.extend( { }, obj1, obj2 }

EDITO

Explicación del último punto:

$.extend( ) extendiende el primer argumento con los atributos de los otros 2, y devuelve ese primer argumento. Como le pasamos un objeto vacío, sin contenido previo, copia el contenido de los otros 2 objetos sobre ese objeto vacio; al finalizar, target contiene todos los atributos contenidos en los otros 2, que no han sido modificados.

Pol último, $.extend( ) nos devuelve el objeto que le pasamos como primer argumento (recordemos que los objetos se pasan por referencia), con lo que ya tenemos nuestra operacion union realizada.

De la documentación de JQuery:

$.extend( target, obj1, [ obj2 ] ) -> añade el contenido de los obj1, obj2, al target, y devuelve este último.

Es decir, que el comportamiento correcto y esperado es el que tú das por erróneo. Lo raro es el primer caso, que según dices, no hace lo mismo.

¿ Seguro que en el primer caso que expones, ambos, jTemp y jDef, no terminan con los mismos atributos ?

Si lo que quieres es añadir un atributo a un objeto ya creado, es tan fácil como hacer una simple asignación.

Si lo que quieres es obtener un objeto que mezcle otros 2, sería:

result = $.extend( { }, obj1, obj2 }

EDITO

Explicación del último punto:

$.extend( ) extendiende el primer argumento con los atributos de los otros 2, y devuelve ese primer argumento. Como le pasamos un objeto vacío, sin contenido previo, copia el contenido de los otros 2 objetos sobre ese objeto vacio; al finalizar, target contiene todos los atributos contenidos en los otros 2, que no han sido modificados.

Pol último, $.extend( ) nos devuelve el objeto que le pasamos como primer argumento (recordemos que los objetos se pasan por referencia), con lo que ya tenemos nuestra operacion union realizada.

EDITO 2

Veamos tu nuevo código de muestra:

function obtenerBBDD() {
    return [{cod: 1, desc: '111'}, {cod: 2, desc: '222'}];
}

var jDef = {id: 'hola', valores: obtenerBBDD()};
// jDef = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222"}]}

var jTemp = $.extend({ },  jDef);
// jTemp = {"id":"hola","valores":[{"cod":1,"desc":"111"},{"cod":2,"desc":"222","selected":true}]}

Aqui empezamos con los problemas. jTemp["valores"] no es un objeto independiente, es una referencia al "valores" contenido en jDef.

Es este justo momento, jTemp.valores es el mismo objeto que jDef.valores.

A partir de ahí, cualquier cambio a uno de ellos afecta al otro.

SOLUCION

  1. Usar $.extend( ) con 4 parámetros, para que haga una copia recursiva: var jTemp = $.extend( true, { }, jDef ). Según la documentación, ese true inicial forzará la copia recursiva, de modo que jTemp y jDef no estén enlazados, y se resuelva el problema.
se añadieron 605 caracteres en el cuerpo
Origen Enlace
Trauma
  • 26.9k
  • 5
  • 42
  • 68
Loading
se añadieron 113 caracteres en el cuerpo
Origen Enlace
Trauma
  • 26.9k
  • 5
  • 42
  • 68
Loading
Origen Enlace
Trauma
  • 26.9k
  • 5
  • 42
  • 68
Loading