Exactement cloner un objet en javascript

jQuery.étendre n'est pas qui vous attend à utiliser l'opérateur instanceof. Il est en train de faire une glorieusement compliqué copie, et non pas un véritable clone. En parcourant les éléments ne sont pas assez. Aussi, appeler le constructeur est préférable de ne pas causer vous perdrez vos arguments. Essayez ceci:

var MyClass = function(param1, param2) {
    alert(param1.a + param2.a);
    this.p1 = param1;
    this.p2 = param2;
};

function Clone() { }
function clone(obj) {
    Clone.prototype = obj;
    return new Clone();
}

var myObj = new MyClass({a: 1},{a: 2});
var myObjClone = clone(myObj);
alert(myObj instanceof MyClass);      //=> true
alert(myObjClone instanceof MyClass); //=> true
console.log(myObj);       //note they are
console.log(myObjClone)   //exactly the same

Être conscient que votre prototype points maintenant de retour à l'original (myObj), toute modification de myObj reflètent la myObjClone. Javascript prototypes héritage est un peu délicat. Vous devez être sûr que votre nouvel objet a le bon prototype, et par conséquent, le constructeur.

Admitadly, Javascript rend mon mal à la tête. Pourtant, je pense que je suis en train de lire ce droit, à partir de la Langage ECMAScript spec:

13.2.2 [[Construction]]

Lors de la [[Construction]] méthode interne pour un objet de Fonction F est appelée avec une liste vide d'arguments, les mesures suivantes sont prises:

1. Laisser obj être nouvellement créé, natif ECMAScript objet.
2. Définir toutes les méthodes internes de l'obj, comme spécifié dans le 8.12.
3. Ensemble de la [[Catégorie]] propriété interne de l'obj pour "Objet".
4. Ensemble de la [[Extensible]] propriété interne de l'obj de vrai.
5. Laisser proto être la valeur de l'appel de la [[Get]] propriété interne de F avec l'argument >"prototype".
6. Si Type(proto) est Objet de définir les [[Prototype]] propriété interne de l'obj à proto.
7. Si Type(proto) n'est pas Objet, définissez la [[Prototype]] propriété interne de l'obj à l' >standard intégré dans l'Objet prototype de l'objet tel que décrit dans 15.2.4.
8. Laisser résultat le résultat de l'appel de la [[Appel]] propriété interne de F, offrant >obj comme cette valeur et de fournir la liste des arguments passés en [[Construction]] comme args.
9. Si Type(résultat) est l'Objet, puis retourner le résultat.
10. Retour obj.

Cette personne semble comprendre le concept beaucoup mieux que moi. K, je vais revenir à java où je nage plus que je ne l'évier 🙂 .

Après avoir pris l'inspiration de certaines réponses que j'ai trouvé sur StackOverflow, je suis venu avec une fonction qui est très flexible, et fonctionne même quand l'objet ou de l'une de ses sous-objets a un constructeur avec paramètres requis (grâce à l'Objet.créer).

(Merci à Justin McCandless cela prend désormais en charge cyclique références ainsi.)

//If Object.create isn't already defined, we just do the simple shim, without the second argument,
//since that's all we need here
var object_create = Object.create;
if (typeof object_create !== 'function') {
object_create = function(o) {
function F() {}
F.prototype = o;
return new F();
};
}
/**
* Deep copy an object (make copies of all its object properties, sub-properties, etc.)
* An improved version of http://keithdevens.com/weblog/archive/2007/Jun/07/javascript.clone
* that doesn't break if the constructor has required parameters
* 
* It also borrows some code from http://stackoverflow.com/a/11621004/560114
*/ 
function deepCopy(src, /* INTERNAL */ _visited, _copiesVisited) {
if(src === null || typeof(src) !== 'object'){
return src;
}
//Honor native/custom clone methods
if(typeof src.clone == 'function'){
return src.clone(true);
}
//Special cases:
//Date
if(src instanceof Date){
return new Date(src.getTime());
}
//RegExp
if(src instanceof RegExp){
return new RegExp(src);
}
//DOM Element
if(src.nodeType && typeof src.cloneNode == 'function'){
return src.cloneNode(true);
}
//Initialize the visited objects arrays if needed.
//This is used to detect cyclic references.
if (_visited === undefined){
_visited = [];
_copiesVisited = [];
}
//Check if this object has already been visited
var i, len = _visited.length;
for (i = 0; i < len; i++) {
//If so, get the copy we already made
if (src === _visited[i]) {
return _copiesVisited[i];
}
}
//Array
if (Object.prototype.toString.call(src) == '[object Array]') {
//[].slice() by itself would soft clone
var ret = src.slice();
//add it to the visited array
_visited.push(src);
_copiesVisited.push(ret);
var i = ret.length;
while (i--) {
ret[i] = deepCopy(ret[i], _visited, _copiesVisited);
}
return ret;
}
//If we've reached here, we have a regular object
//make sure the returned object has the same prototype as the original
var proto = (Object.getPrototypeOf ? Object.getPrototypeOf(src): src.__proto__);
if (!proto) {
proto = src.constructor.prototype; //this line would probably only be reached by very old browsers 
}
var dest = object_create(proto);
//add this object to the visited array
_visited.push(src);
_copiesVisited.push(dest);
for (var key in src) {
//Note: this does NOT preserve ES5 property attributes like 'writable', 'enumerable', etc.
//For an example of how this could be modified to do so, see the singleMixin() function
dest[key] = deepCopy(src[key], _visited, _copiesVisited);
}
return dest;
}

Cette fonction est une partie de mon simpleOO bibliothèque; toutes les corrections de bugs ou des améliorations seront apportées là (n'hésitez pas à ouvrir un sujet sur github si vous découvrez certains bug).

• Documentation de base
• Exemple

Le problème, c'est que vous êtes de passage dans un nouvel objet à copier à '{}'. C'est pourquoi vous perdez votre type. J'ai trouvé que si vous enveloppez-le véritable objet avant de le transmettre et de le déballer l'objet copié par la suite, étendre à préserver le type comme prévu.

function clone(obj)
{
var wrappedObj = { inner: obj };
var newObject = jQuery.extend(true, {}, wrappedObj);
newObject = newObject.inner;
return newObject;
}

Voici une autre solution qui n'est pas exactement la copier ou cloner quoi que ce soit, mais devrait donner les résultats souhaités.

var myObj = new MyClass({a: 1},{a: 2});
var myObjCreator = MyClass.bind(this, {a: 1},{a: 2});
var myObjClone = new myObjCreator();

Il utilise du Javascript bind fonction de créer un objet qui passe automatiquement dans les paramètres donnés à la MyClass constructeur.

J'ai eu des exigences similaires à celles de l'OP et cela a fonctionné pour moi donc, j'ai pensé à la poster, mais je me rends compte que certaines personnes pourraient avoir besoin d'une vrai copie en profondeur sur un objet modifié et cela ne tient pas le projet de loi.