JSON对象实现深度克隆
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JSON对象实现深度克隆相关的知识,希望对你有一定的参考价值。
cloneObj = function(obj)
var newobj = obj.constructor === Object ? : [];
if(typeof JSON === 'object')
var s = JSON.stringify(obj), //系列化对象
newobj = JSON.parse(s); //反系列化(还原)
else
if(newobj.constructor === Array)
newobj.concat(obj);
else
for(var i in obj)
newobj[i] = obj[i];
return newobj;
;
这是js深度克隆的一般实现,这儿JSON这个对象为什么一直没有查到,JSON对象所带的方法如Stringify是新定义的???
var newobj = obj.constructor === Object ? : [];
if(typeof JSON === 'object')
var s = JSON.stringify(obj), //系列化对象
newobj = JSON.parse(s); //反系列化(还原)
else
if(newobj.constructor === Array)
newobj.concat(obj);
else
for(var i in obj)
newobj[i] = obj[i];
return newobj;
参考技术B 百度百度百度
26.JavaScript实现对象混合与对象浅度克隆和对象的深度克隆
JavaScript实现对象混合与对象浅度克隆和对象的深度克隆
1.实现对象混合:
this.myPlugin = this.myPlugin || {}; /** * 将obj2混合到obj1产生新对象 * 实现方式1 */ this.myPlugin.mixObj = function (obj1, obj2) { var newObj = {}; //把obj2对象中的所有属性和值,赋值到newObj中 for (var prop in obj2) { if (obj2.hasOwnProperty(prop)) { //obj2继承的属性不被混合 newObj[prop] = obj2[prop]; } } //找到obj1中有但是obj2中没有的属性 for (var prop in obj1) { if (obj1.hasOwnProperty(prop) && !(prop in obj2)) { newObj[prop] = obj1[prop]; } } return newObj; } /** * 将obj2混合到obj1产生新对象 * 实现方式2 */ this.myPlugin.mixObj = function (obj1, obj2) { return Object.assign({}, obj1, obj2); }
调用对象混合:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script src="./js/myPlugin.js"></script> <script> var obj1 = { x:1, y:2, z:3 } var obj2 = { x:"abc", a:4, y:"bcd" } var obj = myPlugin.mixObj(obj1, obj2); console.log(obj); </script> </body> </html>
效果展示:
2.实现对象浅度克隆和深度克隆
this.myPlugin = this.myPlugin || {}; /** * 把某个对象进行浅度克隆或深度克隆 * @param {boolean} deep 是否深度克隆,默认false */ this.myPlugin.clone = function (obj, deep) { if (Array.prototype.isPrototypeOf(obj)) { //是数组 if (deep) { //深度克隆 var newObj = []; for (var i = 0; i < obj.length; i++) { newObj.push(this.clone(obj[i], deep)); } return newObj; } else { return obj.slice(); //返回一个数组 } } else if ((typeof obj === "object") && (typeof obj !== null)) { var newObj = {}; for (var prop in obj) { if (obj.hasOwnProperty(prop)) { if (deep) { newObj[prop] = this.clone(obj[prop], deep); } else { newObj[prop] = obj[prop]; } } } return newObj; } else { //函数、原始类型:null, string, undefined, boolean, number return obj; //递归的终止条件 } }
调用对象浅度克隆:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script src="./js/myPlugin.js"></script> <script> var obj1 = { array:[ function(){}, null, "string", undefined, 1, false ], obj:{ value1:null, value2:undefined, value3:"string", value4:1, value5:true } } </script> </body> </html>
效果展示:
调用对象深度克隆:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script src="./js/myPlugin.js"></script> <script> var obj1 = { array:[ function(){}, null, "string", undefined, 1, false ], obj:{ value1:null, value2:undefined, value3:"string", value4:1, value5:true } } </script> </body> </html>
效果展示:
以上是关于JSON对象实现深度克隆的主要内容,如果未能解决你的问题,请参考以下文章