Possible Duplicate:
How to clone js object?
This is another way to create a javascript object (using object literal notation instead of function):
user = {
name: "Foo",
email: "[email protected]"
}
Is there a way to clone this object or is it a singleton?
Try this:
var clone = (function(){
return function (obj) { Clone.prototype=obj; return new Clone() };
function Clone(){}
}());
Here's what's going on.
__proto__.The cloned object will share all the properties of the original object without any copies of anything being made. If properties of the cloned object are assigned new values, they won't interfere with the original object. And no tampering of built-ins is required.
Keep in mind that an object property of the newly-created object will refer to the same object as the eponymous property of the cloned object. Assigning a new value to a property of the clone won't interfere with the original, but assigning values to the clone's object properties will.
Try this in chrome or firebug console:
var user = {
name: "Foo",
email: "[email protected]"
}
var clonedUser = clone(user);
console.dir(clonedUser);
A detailed explanation of this cloning technique can be found here.
user={name:"",email:"",obj:{a:"A"}}; clonedUser=clone(user);, clonedUser.obj.a="B"; you'll find user.obj.a == "B"
obj property will not exhibit this behavior. The request was for a clone, not a copy, and not a deep copy. See the link at the end of my answer.clone and the vernacular definition of a clone.A cloned is B. A makes changes to property, B sees it. B makes changes to property, A doesn't give a ----. In your example, they would both share a nested object. If B makes changes to that object's property, A should not see the change. In all, cloning is discouraged, deep copying is encouraged.You can use JSON object (present in modern browsers):
var user = {name: "Foo", email: "[email protected]" }
var user2 = JSON.parse(JSON.stringify(user))
user2.name = "Bar";
alert(user.name + " " + user2.name); // Foo Bar
See in jsfiddle.
EDIT
If you need this in older browsers, see http://www.json.org/js.html.
properties and methods, then my friend, using this JSON style, methods are not cloned
I like to use this:
if (typeof Object.create !== 'function') {
Object.create = function (o) {
var F = function () {};
F.prototype = o;
return new F();
};
}
then any object I want to clone can be done as:
user = {
name: "Foo",
email: "[email protected]"
};
var user2 = Object.create(user);
As shown in (or similar to) JavaScript The Good Parts
Most of the javascript frameworks have good support for object cloning.
var a= {'key':'value'};
var b= jQuery.extend( true, {}, a );
Object.prototype.clone = function clone(obj) {
obj = obj || this;
var new_obj = {};
for( var p in obj ) {
if ( obj.hasOwnProperty(p) ) {
if( obj[p] !== null && typeof(obj[p]) === "object" ) {
new_obj[p] = clone( obj[p] );
}
else {
new_obj[p] = obj[p];
}
}
}
return new_obj;
};
/* Example */
var foo = {
name: "Foo"
, email: "[email protected]"
, obj: {a:"A",b:"B"}
};
var bar = foo.clone();
bar.name = "Bar";
bar.obj.b = "C";
// foo and bar should have a different 'name'
// foo and bar should retain the same email
// foo and bar should have different values for <foo/bar>['obj']['b']
// foo and bar should have the same values for <foo/bar>['obj']['a']
console.dir(foo);
console.dir(bar);
JQuery, then never mess with anything and forget how to do anything.in and suddenly they'll have extra properties in there, because another developer modified built-ins without them knowing.
var user2 = user;. Only theclonefunction is causing the constructor name to be changed. Thats not cloning, thats a duplicate reference !!