码迷,mamicode.com
首页 > Web开发 > 详细

js的浅拷贝和深拷贝

时间:2017-11-10 00:20:29      阅读:180      评论:0      收藏:0      [点我收藏+]

标签:fun   oar   操作   span   cti   console   return   function   copy   

前言:对象的直接量赋值其实是一种引用,对赋值后的对象修改操作会影响到原始对象值,这里的其中包括object和Array。

一、浅拷贝

浅拷贝只是复制对象的一个指针,修改复制对象属性相当于修改原始对象的属性

代码如下:

function shallowCopy(obj2) {
	var obj1 = {};
    for (var prop in obj2) {
  	    // 判断是否是自有属性
	    if (obj2.hasOwnProperty(prop)) {
	      obj1[prop] = obj2[prop];
	    }
    }
    return obj1;
}
var myobj = {
	name:"水月",
	oarr:[2,3],
	book:{date:2017},
	sayName:function(){
		alert(this.name);
	}
};
var newObj = shallowCopy(myobj);
// 修改复制的对象,原始对象也会被修改
newObj.oarr[1] = 5;
newObj.book.date = 2018;
console.log(myobj.oarr);
console.log(myobj.book.date);

  

二、深拷贝

深拷贝,它不仅将原对象的各个属性逐个复制出去,而且将原对象各个属性所包含的对象也依次采用深复制的方法递归复制到新对象上

代码如下:

function deepClone(obj) {
 var o;
 if (typeof obj == "object") {
     if (obj === null) {
          o = null;
     } else {
           // 如果对象是数组
          if (obj instanceof Array) {
              o = [];
             for (var i = 0, len = obj.length; i < len; i++) {
                  // 对象的属性如果是对象继续递归
                 o.push( deepClone(obj[i]) );
             }
         } else {
             o = {};
             for (var j in obj) {
                o[j] = deepClone(obj[j]);
             }
         }
     }
 } else {
     o = obj;
 }
     return o;
};
var oldObj = {
    name:"小明",
    oarr:[1,2],
    book:{date:2027},
    sayName:function(){
        alert(this.name);
    }
};
var deepObj = deepClone(oldObj);
// 复制的对象的数组添加一个元素,不会影响到被复制对象的数组
deepObj.oarr.push(3);
console.log(oldObj.oarr);
console.log(deepObj.oarr);

 

js的浅拷贝和深拷贝

标签:fun   oar   操作   span   cti   console   return   function   copy   

原文地址:http://www.cnblogs.com/viva-yue/p/objCopy.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!