3

Estoy necesitando clonar un objeto en JavaScript, de momento para objetos simples que únicamente contengan solo atributos lo estoy haciendo de la siguiente manera usando JSON.stringify() y JSON.parse():

let original = { nombre: 'juan', apellido: 'peres', edad: 23 }
let copia = JSON.parse(JSON.stringify(original));

No creo que sea lo mas optimo (por eso la pregunta) pero funciona, la dudad es, como hacer para clonar cualquier objeto que contenga métodos o funciones internas definidas por ejemplo.

1

4 respuestas 4

5

Puedes utilizar Object.assign(objetivo, ...fuentes), pero es a partir de ECMAScript 2015.

const objeto = { id: 1, name: 'abc' };
const objetoClonado = Object.assign({}, objeto);
2

Aqui un articulo muy bueno sobre la clonacion:

/** Clona un objeto (deep-copy)
 * @param  {Any}    from: el objeto a clonar
 * @param  {Object} dest: (opcional) objeto a extender
 * @return {Any} retorna el nuevo objeto clonado
 */
var fnClone = (function() {
  // @Private
  var _toString = Object.prototype.toString;
 
  // @Private
  function _clone (from, dest, objectsCache) {
    var prop;
    // determina si @from es un valor primitivo o una funcion
    if (from === null || typeof from !== "object") return from;
    // revisa si @from es un objeto ya guardado en cache
    if (_toString.call(from) === "[object Object]") {
      if (objectsCache.filter(function (item) {
        return item === from;
      }).length) return from;
      // guarda la referencia de los objetos creados
      objectsCache.push(from);
    }
    // determina si @from es una instancia de alguno de los siguientes constructores
    if (from.constructor === Date || from.constructor === RegExp || from.constructor === Function ||
      from.constructor === String || from.constructor === Number || from.constructor === Boolean) {
      return new from.constructor(from);
    }
    if (from.constructor !== Object && from.constructor !== Array) return from;
    // crea un nuevo objeto y recursivamente itera sus propiedades
    dest = dest || new from.constructor();
    for (prop in from) {
      // TODO: allow overwrite existing properties
      dest[prop] = (typeof dest[prop] === "undefined" ?
          _clone(from[prop], null, objectsCache) :
          dest[prop]);
    }
    return dest;
  }
 
  // función retornada en el closure
  return function (from, dest) {
    var objectsCache = [];
    return _clone(from, dest, objectsCache);
  };
 
}());

var freeman, david;
 
function Freeman() {
    this.name = "Gordon Freeman";
    this.character = "Freeman";
    this.game = "Half-Life";
    this.friends = [];
}
 
david = {
    name: "David Rivera",
    character: "jherax",
    friends: [],
    languages: new RegExp(/javascript|jquery|c#|sql|java|vb/i),
    greeting: function() { return "Hi, I am " + this.name },
    info: {
        job: "programmer",
        birth: new Date()
    }
};
 
freeman = new Freeman();
 
//creamos la referencia circular
freeman.friends = [david, "Barney Calhoun"];
david.friends = [freeman, "John Carmack"];
 
//clonamos el objeto @david
var cloned = fnClone(david);
 
//modificamos propiedades del objeto original
david.name = david.name + " (jherax)";
david.friends.push("Jim Rynor");
 
//vemos que @cloned no fue modificado
console.log("original:", david.name, david.friends);
console.log("clonado:", cloned.name, cloned.friends);

2
  • Ya puse el link del autor @AlvaroMontoro pense que lo habia puesto. Lo siento
    – Alvarez
    Commented el 5 sept. 2017 a las 22:14
  • no pasa nada. Me llamó la atención por cómo estaba escrito
    – Alvaro Montoro
    Commented el 5 sept. 2017 a las 22:29
0

Con jQuery podés utilizar la función extend.

var copia = jQuery.extend(true, {}, original);

Acá te dejo el link para que averigues mejor. https://api.jquery.com/jquery.extend/

2
  • no creo que esa sea una buena manera ya que extend mezcla o combina el contenido de los objetos Commented el 5 sept. 2017 a las 21:28
  • Justamente lo que hace es pasar todas las propiedades del objeto original a un JSON vacío, uno por uno y guardas el resultado en la variable copia. El primer objeto q se pasa es modificado, los demás no son alterados, solo se copia sus valores. JQuery mismo lo usa para dicho fin internamente. Commented el 5 sept. 2017 a las 21:32
0

Hay una forma muy sencilla de clonar un objeto con el método estático assign de Object

var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

enlace documentación de js mozilla developer network

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.