解决js、vue、小程序对象引用的问题

解决js、vue、小程序对象引用的问题

当我们在做数据处理的时候，不管是使用js、vue，或者是在小程序中，经常会碰到数据引用的问题。

拿vue举例:

1.在data中初始两个对象

data:{
    defaultObject:{
        value:"123"
    },
    newObject:"",
}

2.把defaultObject的内容赋值给newObject，改变newObject里面对象的值，发现defaultObject里面对象的值也会跟着变化。因为当this.newObject = this.defaultObject时，两者之间已经存在引用关系，此时newObject 里面对象改变时，defaultObject里面对象也会同时发生变化。

this.newObject = this.defaultObject;
this.newObject.value = "456";
console.log("newObject:" + this.newObject.value);
console.log("defaultObject:" + this.defaultObject.value);

3.快速解决问题的方法：先把defaultObject转换成字符串，然后再转换成对象赋值给newObject

this.newObject = JSON.parse(JSON.stringify(this.defaultObject));
this.newObject.value = "456";
console.log("newObject:" + this.newObject.value);
console.log("defaultObject:" + this.defaultObject.value);

在js中有一节“复制变量值”就提到这个：