JavaScript中深淺拷貝的原理是什么，相信很多沒有經(jīng)驗的人對此束手無策，為此本文總結了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個問題。

成都創(chuàng)新互聯(lián)堅信：善待客戶，將會成為終身客戶。我們能堅持多年，是因為我們一直可值得信賴。我們從不忽悠初訪客戶，我們用心做好本職工作，不忘初心，方得始終。10余年網(wǎng)站建設經(jīng)驗成都創(chuàng)新互聯(lián)是成都老牌網(wǎng)站營銷服務商,為您提供網(wǎng)站建設、成都網(wǎng)站設計、網(wǎng)站設計、成都h5網(wǎng)站建設、網(wǎng)站制作、成都品牌網(wǎng)站建設、小程序開發(fā)服務,給眾多知名企業(yè)提供過好品質的建站服務。

1、賦值

改變新對象時不管第幾層，老對象都會隨著變化。

 var people = {
 name: "小明",
 act: ["吃飯","睡覺"]
}
var people1 = people;//賦值
people1.name = "小紅";
 people1.act[1] = "打游戲";
console.log(people.name);//小紅
console.log(people.act);//["吃飯", "打游戲"]

2、淺拷貝

改變新對象第一層基本數(shù)據(jù)類型時，老對象不變。有子對象時，改變子對象，老對象會隨著變化。

 var people = {
  name: "小明",
  act: ["吃飯", "睡覺"]
}
var people1 = Object.assign({}, people);//淺拷貝
people1.name = "小紅";
people1.act[1] = "打游戲";
console.log(people.name);//小明
console.log(people.act);// ["吃飯", "打游戲"]

3、深拷貝

不管改變新對象第幾層，老對象都不會隨之改變。

var people = {
  name: "小明",
  act: ["吃飯", "睡覺"]
}
var people1 = JSON.parse(JSON.stringify(people));//深拷貝
people1.name = "小紅";
people1.act[1] = "打游戲";
console.log(people.name);//小明
console.log(people.act);// ["吃飯", "睡覺"]

總結一下就是：

	第一層為基本數(shù)據(jù)類型	多于一層含有子對象
賦值	新老一起改變	新老一起改變
淺拷貝	新對象改變，老對象不變	新老一起改變
深拷貝	新對象改變，老對象不變	新對象改變，老對象不變

了解完了區(qū)別，下面介紹實現(xiàn)深淺拷貝的幾個方法。

一、淺拷貝

1、Object.assign（）

官方對這個函數(shù)的介紹是：Object.assign() 方法用于將所有可枚舉屬性的值從一個或多個源對象復制到目標對象。實際上就是會把屬性中的簡單數(shù)據(jù)類型直接復制，而對于對象屬性，只會拷貝地址（指針）,上邊介紹區(qū)別時用的就是這個；

var people1 = Object.assign({}, people);

需要注意的是，如果對象沒有子對象，Object.assign（）實現(xiàn)的就是深拷貝。

2、展開運算符（ES6新增）

var people = {
  name: "小明",
  act: ["吃飯", "睡覺"]
}
var people1 = {...people};
people1.name = "小紅";
people1.act[1] = "打游戲";
console.log(people.name);//小明
console.log(people.act);// ["吃飯", "打游戲"]

3、自己寫

 var people = {
  name: "小明",
  act: ["吃飯", "睡覺"]
 }
 var people1 = shallowCopy(people);
 people1.name = "小紅";
 people1.act[1] = "打游戲";
 console.log(people.name);//小明
 console.log(people.act);// ["吃飯", "打游戲"]
 function shallowCopy(obj) {
  var res = {};
  for (var index in obj) {
  if (obj.hasOwnProperty(index)) {//不復制原型鏈上的屬性
   res[index] = obj[index];
  }
  }
  return res;
 }

二、深拷貝

1、JSON.parse(JSON.stringify(obj))

上邊介紹區(qū)別時用的就是這個：

var people1 = JSON.parse(JSON.stringify(people));//深拷貝

這個方法比較簡便但也存在問題

1、不能復制對象中的函數(shù)。

2、會忽略對象中的undefind。

2、lodash函數(shù)

官方介紹是：lodash是一個一致性、模塊化、高性能的 JavaScript 實用工具庫。官網(wǎng)是
www.lodashjs.com/ ，我推薦用其中的_.cloneDeep(value)方法。

ar objects = [{ "a": 1 }, { "b": 2 }];
 
var deep = _.cloneDeep(objects);
console.log(deep[0] === objects[0]);
// => false

看完上述內容，你們掌握JavaScript中深淺拷貝的原理是什么的方法了嗎？如果還想學到更多技能或想了解更多相關內容，歡迎關注創(chuàng)新互聯(lián)成都網(wǎng)站設計公司行業(yè)資訊頻道，感謝各位的閱讀！

另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。

文章名稱：JavaScript中深淺拷貝的原理是什么-創(chuàng)新互聯(lián)
文章出自：http://weahome.cn/article/igjod.html