One line of code implements deep cloning of pure data json objects

Source: Internet
Author: User

Copy codeThe Code is as follows:
Var dataObjCloned = JSON. parse (JSON. stringify (dataObj ))

This is what I saw on the big city chubby Weibo last night. At that time, I was very interested. I just marked it.
Today, I sorted out the following documents and analyzed why a single sentence can achieve deep cloning of pure data json objects.
1. JSON. stringify Function
Copy codeThe Code is as follows:
Converts a JavaScript value to a JavaScript Object Notation (Json) string.
JSON. stringify (value [, replacer] [, space])
Parameters
Value
Required. The JavaScript value to be converted (usually an object or array ).
Replacer
Optional. The function or array of the conversion result.
If replacer is a function, JSON. stringify calls this function and passes in the keys and values of each member. Use the return value instead of the original value. If this function returns undefined, the Member is excluded. The root object key is an empty string :"".
If replacer is an array, only the Members with key values in the array are converted. The conversion sequence of members is the same as that of keys in the array. When the value parameter is an array, the replacer array is ignored.
Space
Optional. Add indentation, blank spaces, and line breaks to the returned JSON text to make it easier to read.
If space is omitted, the returned text is generated without any additional blank space.
If space is a number, the returned text is indented at each level to specify the number of spaces. If space is greater than 10, the text is Indented by 10 spaces.
If space is a non-empty string (for example, "\ t"), the returned text is indented to the number of characters in the string at each level.
If space is a string of more than 10 characters, the first 10 characters are used.
Return Value
A string containing JSON text.

From the above introduction, we can see that this function converts an object or array into a json string.
2. JSON. parse function
Copy codeThe Code is as follows:
Converts a JavaScript Object Notation (Json) string to an object.
JSON. parse (text [, reviver])
Parameters
Text
Required. A valid JSON string.
Reviver
Optional. A function of the conversion result. This function will be called for each member of the object. If a member contains a nested object, the nested object is converted before the parent object. For each member, the following situations occur:
• If reviver returns a valid value, the member value is replaced with the converted value.
• If reviver returns the same value it receives, the member value is not modified.
• If reviver returns null or undefined, the Member is deleted.
Return Value
An object or array.

From the above introduction, we can see that this function converts a json string into an object or array.
3. Example
Array cloning:
Copy codeThe Code is as follows:
Var obj = [1, 2, [3, 4, 5];
Var objCloned = JSON. parse (JSON. stringify (obj ));
Console. log (obj );
Console. log (JSON. stringify (obj ));
Console. log (objCloned );
ObjCloned [0] = 6;
Console. log (obj );
Console. log (objCloned );

Lab results:

From the above results, we found that an array was indeed cloned in depth.
Object cloning:
Copy codeThe Code is as follows:
Var obj = {name: 'rey ', info: {location: 'beijing', age: '28 '}};
Var objCloned = JSON. parse (JSON. stringify (obj ));
Console. log (obj );
Console. log (JSON. stringify (obj ));
Console. log (objCloned );
Console. log (JSON. stringify (objCloned ));
ObjCloned. name = 'luopanc ';
Console. log (obj );
Console. log (JSON. stringify (obj ));
Console. log (objCloned );
Console. log (JSON. stringify (objCloned ));

Lab results:
 
From the above experiment, we found that this method can also clone objects.
4. However, all the above experiments are for pure data. That is to say, this method is only valid in arrays or object clones of pure data.
Non-pure data experiments:
Copy codeThe Code is as follows:
Var obj = {name: 'rey ', info: {location: 'beijing', age: '28'}, hello: function () {console. log ('Hello world! ');}};
Var objCloned = JSON. parse (JSON. stringify (obj ));
Console. log (obj );
Console. log (JSON. stringify (obj ));
Console. log (objCloned );
Console. log (JSON. stringify (objCloned ));
ObjCloned. name = 'luopanc ';
Console. log (obj );
Console. log (JSON. stringify (obj ));
Console. log (objCloned );
Console. log (JSON. stringify (objCloned ));

Lab results:
 
From the above experiment, we can see that non-pure data functions cannot be involved in conversion, and they are "despised.
Therefore, this method of in-depth cloning in one sentence is only applicable to pure data, which is a point of attention during development.

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.