JavaScript对象引用

1.JavaScript中常见的赋值和引用
1.案例一:典型的赋值操作
var dog = 66 ;
var cat = dog ;
cat += 33 ;

alert(cat);//99
alert(dog);//66
2.案例二:对象引用导致值得更改
 var horse = [1,2,3];
 var bull = horse ;
 bull.push(4);

 alert(bull);//[1,2,3,4]
 alert(horse);//[1,2,3,4]
3.案例三:对象引用指针发生变化
var donkey = [9,8]
var mule = donkey ;
mule = [6,5];

alert(mule);//[6,5]
alert(donkey);//[9,8]
2.对象浅拷贝

通过以上三个案例可以发现值得引用通常不会出现问题,但是在JavaScript中对象的引用经常会出现对象中的值也会出现引用的问题。在实际程序中经常有这样的需求:拷贝一个对象给另外一个对象实现数据的操纵功能,例如下面的案例:

var American = {
    state:'New York'
};
var China = American ;
China.state = 'Beijing';

alert(American.state);//Beijing
alert(China.state);//Beijing

通过上面的案例发现对象中的属性值被改变了,这也太不符合常理了,我们要的效果是对象引用的时候不对源对象产生污染,怎样做到呢?

var American = {
    state:'New York'
};
function copyObj(srcObj){
      var targetObj = {};

       for(var attr in srcObj){
           targetObj[attr] = srcObj[attr];
       }

       return targetObj ;
}
var China = copyObj(American);

China.state = 'Shanghai';

alert(American.state);//New York
alert(China.state);//Shanghai

上述案例已经解决了对象的引用的问题,其实上述案例就是大名鼎鼎的‘对象浅拷贝’。但是浅拷贝本身还是存在问题的,如果对象有多层的嵌套,那么就会出现内层嵌套对象还是会出现引用的问题,如何解决呢?深度拷贝

3.对象深度拷贝
var American = {
    state: {
        street:'Broadway'
    }
};

function deepCopyObj(srcObj){
    var targetObj = {};

    if(typeof  srcObj != 'object'){
        return srcObj ;
    }

    for(var attr in srcObj){
        targetObj[attr] = deepCopyObj(srcObj[attr]);
    }

    return targetObj ;
}
var China = deepCopyObj(American);

China.state.street = 'BeijingRoad';

alert(American.state.street);//Broadway
alert(China.state.street);//BeijingRoad

上面的深度拷贝中使用了递归的方法解决了问题,至此JavaScript中的对象引用问题已经完美解决。

参考
1.JavaScript原始值和对象引用
2.ECMAScript 对象应用
3.javascript对象引用与赋值
4.知乎JavaScript对象引用讨论

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值