Simple example of jQuery object cloning

Simple example

The code is as follows:

Copy code

// Perform shallow copy (only copy the top-level non-object elements) Var newObject = jQuery. extend ({}, oldObject );   // Deep replication (one layer to the bottom) Var newObject = jQuery. extend (true, {}, oldObject ); The test is as follows: Var obj1 = { 'A': 'S1 ', 'B': [1, 2, 3, {'a': 'S2'}], 'C': {'a': 's3', 'B': [4, 5, 6]} } Var obj2 = $. extend (true, {}, obj1 ); Obj2.a = 's11 '; Obj2. B [0] = 100; Obj2.c. B [0] = 400; Console. log (obj1 ); Console. log (obj2 );

After the value of the element inside obj2 changes, if the value of obj1 remains unchanged, the copy is successful.

ExtJS also has a similar method Ext. apply, so the same function can be achieved with ExtJS alone.

Later in the project, I used a class library that the front-end students wrote to expand jQuery, but some methods were not implemented, such as live. With jQuery used by our background developers in the project, it seems redundant. There is an extended method for cloning objects, as shown below:

The code is as follows:

Copy code

/** Copy an Object * @ Param {Object} obj Object to be copied * @ Return {Object} returns a new Object * @ Static */ Clone: function (obj ){ Var objClone; If (obj instanceof Array ){ ObjClone = []; For (var I = 0; I <obj. length; I ++) ObjClone [I] = Js. clone (obj [I]); Return objClone; } Else if (obj instanceof Object ){ If (obj. constructor = Object ){ ObjClone = new obj. constructor (); } Else { ObjClone = new obj. constructor (obj. valueOf ());         } For (var key in obj ){ If (objClone [key]! = Obj [key]) { If (typeof (obj [key]) = 'object '){ ObjClone [key] = Js. clone (obj [key]); } Else { ObjClone [key] = obj [key];                 }             }         } ObjClone. toString = obj. toString; ObjClone. valueOf = obj. valueOf; Return objClone;     } Return obj; }

As a result, the background developers have to replace all references with jQuery implementation and change this method to jQuery extension, as shown below:

The code is as follows:

Copy code

$. Extend ({ CloneObj: function (obj ){ Var objClone; If (obj instanceof Array ){ ObjClone = []; For (var I = 0; I <obj. length; I ++) ObjClone [I] = $. cloneObj (obj [I]); Return objClone; } Else if (obj instanceof Object ){ If (obj. constructor = Object ){ ObjClone = new obj. constructor (); } Else { ObjClone = new obj. constructor (obj. valueOf ());             } For (var key in obj ){ If (objClone [key]! = Obj [key]) { If (typeof (obj [key]) = 'object '){ ObjClone [key] = $. cloneObj (obj [key]); } Else { ObjClone [key] = obj [key];                     }                 }             } ObjClone. toString = obj. toString; ObjClone. valueOf = obj. valueOf; Return objClone;         } Return obj;     } });

It is okay to try it, but it always feels redundant. In What is the most efficient way to clone a JavaScript object? The answer provided by the jQuery author John Resig is as follows.

The code is as follows:	Copy code
// Shallow copy Var newObject = jQuery. extend ({}, oldObject ); // Deep copy Var newObject = jQuery. extend (true, {}, oldObject );

We are building another wheel. The idea of extending the jQuery class library by yourself is good, but it is impossible for a person to maintain it. After all, many times I have to be busy with other projects.