在日常的Vue開發工作中，我們經常對請求來的數據進行變量賦值操作，再用變量去進行數據渲染。 然而我們知道，我們經常用的賦值方式 “=” 實際上屬于數據的淺拷貝，也就是當你改變賦值變量時，原數據也會發生相應變化。var a = ['1', '2', '3', '4', '5'];

var b = a;

b[0] = '2';

console.log(a); // ['2', '2', '3', '4', '5']

console.log(b); // ['2', '2', '3', '4', '5']

//因為b淺拷貝a, ab指向同一個內存地址(堆內存中存的值)

那當我們需要改變變量的值但是不改變原來數據的時候，我們可以借助JSON方法來實現數據的深拷貝賦值：JSON.parse(JSON.stringify(this.responseData));

e.g：let data1 = this.selectform.keyList

let data2 = JSON.parse(JSON.stringify(this.selectform.keyList))

data1.a = 'test'

console.log(data1.a) // test

console.log(this.selectform.keyList.a) // test

data2.a = 'test222'

console.log(keydata2.a) // test222

console.log(this.selectform.keyList.a) // test

*附深淺拷貝示意圖：

淺拷貝：

深拷貝：

總結

以上是生活随笔為你收集整理的vue对象深拷贝_Vue 对数据对象实现深拷贝赋值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。