Using JavaScript to implement deep cloning of objects __java

Source: Internet
Author: User

Data types in javascript fall into two broad categories: the original type and the object type. (1) The original type includes: Value, String, Boolean, null, undefined (we need to clone mainly the first three) (2) object types include: Objects (object), Functions (function), arrays (array). The two types of data are handled differently in the cloning process, and the following are the first ways to clone two data types. first, original type clone

1, the numerical cloning

var x=1;
var y=x;
y=2;
Console.log (x);  1
console.log (y);  2

2, the clone of the string

var x= "abc";
var y=x;
Y= "Def";
Console.log (x);  ABC
console.log (y);  Def

3, the clone of the Boolean value

var x = true;
var y = x;
Y=false;
Console.log (x);  True
console.log (y);  False

Since the original type stores the actual data of the object, we can get the correct result by simply copying it without affecting the previous object. ii. Cloning of object types

1, the cloning of the array

var x = [1,2,3];
var y = x;
Console.log (y);  [1,2,3]
Y.push (4);
Console.log (y);  [1,2,3,4]
console.log (x);  [1,2,3,4]

Object types store The object's reference address, while the object's actual content is stored separately because the object type is usually large, which is a means of optimizing data overhead and memory overhead. So we can't assign as simple as the original data type, but we should walk through each element of the data and copy each of the original data types in the past, doing the following:

var x = [1,2,3];
var y = [];
for (var i = 0; i < x.length; i++) {
    y[i]=x[i];
}
Console.log (y);  [1,2,3]
Y.push (4);
Console.log (y);  [1,2,3,4]
console.log (x);  [1,2,3]

2, the object of cloning

With reference to the cloning of arrays, we use the same idea for cloning objects:

var x = {A:1,b:2};
var y = {};
for (var i in x) {
    y[i] = X[i];
}
Console.log (y);  Object {a:1, b:2}
y.c = 3;
Console.log (y);  Object {a:1, b:2, c:3}
console.log (x);  Object {a:1, b:2}

3, the function of cloning

var x = function () {console.log (1);};
var y = x;
y = function () {Console.log (2);};
X ();  1
y ();  2

Because objects that are cloned by a function object are copied once and stored in the actual data, they do not affect the object before the clone. Therefore, a simple replication "=" can complete the cloning. iii. Common Object cloning

With the above analysis, we know that for the original type and the function in the object type can be cloned directly through "=" replication, for objects and arrays, you need to traverse each element, and if the element is an object or an array, continue traversing until the original type or function is copied directly through "=".

function Deepclone (obj) {var result;
    var oclass=isclass (obj);
    if (oclass=== "Object") {result={};
    }else if (oclass=== "Array") {result=[];
    }else{return obj;
       for (var key in obj) {var copy=obj[key]; if (isclass (copy) = "Object") {Result[key]=arguments.callee (copy);//Recursive call}else if (isclass (copy) = "Array")
        {Result[key]=arguments.callee (copy);
        }else{Result[key]=obj[key];
} return result;
    //Judge the data type of the object function IsClass (o) {if (o===null) return "null";
    if (o===undefined) return "undefined";
return Object.prototype.toString.call (o). Slice (8,-1); }
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.