javascript - 怎么解决修改一个值为对象的属性时出现的奇葩现象？？-PHP中文网问答

文章专题 AI工具学习下载问答源码最近更新

PHP

会员中心讲师中心微信公众号

javascript - 怎么解决修改一个值为对象的属性时出现的奇葩现象？？

ringa_lee 2017-04-10 17:20:14

[JavaScript讨论组]

670

第一种情况（保存引用至变量a,在修改变量a的值）：

var obj = [
            {
               name: 
                     {
                       test: 'nihao'
                     }
            }
          ];
          
// 未修改的对象
console.log('原始对象：' , JSON.parse(JSON.stringify(obj)));

// 保存引用
var data = obj[0]['name'];

// 修改
data = 'hello'; // 修改不会作用到对象 obj ！！

console.log('修改name属性后的对象：' , JSON.parse(JSON.stringify(obj)));

上面代码执行结果预览：

第二种情况（不保存引用，直接修改）：

var obj = [
            {
               name: 
                     {
                       test: 'nihao'
                     }
            }
          ];

// 未修改的对象
console.log('原始对象：' , JSON.parse(JSON.stringify(obj)));

// 不保存引用后修改，即直接修改
obj[0]['name'] = 'hello'; // 能够作用到对象 Obj！！

console.log('修改name属性后的对象：' , JSON.parse(JSON.stringify(obj)));

上面代码运行结果预览:

为什么会出现如此奇葩的现象？？我实在不太明白....，求解惑

ringa_lee

全部回复(4)

PHP中文网2017-04-10 17:22:14 4楼

data直接被赋值为hello了，和obj[0]['name']无关

赞 +0

添加回复

黄舟2017-04-10 17:22:14 3楼

第一种情况

var data = obj[0]['name']; // step 1
data = 'hello'; // step 2

你把obj[0]['name']看做A, 'hello'看做 B, 第一步data指向A的引用地址，第二步，data指向了B的引用地址。你会发现两步操作只是data的指向变了而已，A 并没有改变，所以对象obj不会改变。

第二种情况

obj[0]['name'] = 'hello'; // 能够作用到对象 Obj！！

这个通过取值并赋值，直接修改属性，当然直接修改对象Obj

其实这是js基础，推荐篇文章：( JS 进阶 )基本类型引用类型简单赋值对象引用

赞 +0

添加回复

怪我咯2017-04-10 17:22:14 2楼

第一种情况 var data = obj[0]['name']; data是字符串类型。直接复制一个内存地址，所以修改data的值不影响obj；
第一种情况 obj[0]['name'] = 'hello'; 已经改变了obj的内容，obj自然会变化。

赞 +0

添加回复

天蓬老师2017-04-10 17:22:14 1楼

var obj = [
            {
               name: 
                     {
                       test: 'nihao'
                     }
            }
          ];
    var data = obj[0]['name'];
    console.log(data);//Object {test: "nihao"}
    data.test="wohao";
    console.log(obj);//obj[0].name.test已经是"wohao"了，data确定是引用
    console.log(obj==data);//false
    data = 'hello'; 
    console.log(data);//hello
    data.test="wohao";
    console.log(data);//hello 说明上一行的赋值是失败的，因为当data是"hello"字符串的时候，它并没有test这个属性，所以不能给data.test赋值，但非严格模式下并不会报错
    console.log(obj);//原obj

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>