本文實例講述了JS淺拷貝和深拷貝原理與實現(xiàn)方法。分享給大家供大家參考,具體如下:
淺拷貝只會拷貝一層,深層的引用類型改變還是會受到影響。
深拷貝是所有內(nèi)部的屬性還有值都被拷貝了一份,不管深層的引用類型怎么改都不會受到影響。
淺拷貝的實現(xiàn)方式
1、自定義函數(shù)
function shallowClone (initalObj) { var obj = {}; for ( var i in initalObj) { obj[i] = initalObj[i]; } return obj;}2、ES6 的 Object.assign()
let newObj = Object.assign({}, obj);3、ES6 的對象擴展
let newObj = {...obj};深拷貝的實現(xiàn)方式
1、JSON.stringify 和 JSON.parse
用 JSON.stringify 把對象轉(zhuǎn)換成字符串,再用 JSON.parse 把字符串轉(zhuǎn)換成新的對象。
可以轉(zhuǎn)成 JSON 格式的對象才能使用這種方法,如果對象中包含 function 或 RegExp 這些就不能用這種方法了。
let newObj = JSON.parse(JSON.stringify(obj));
2、jquery 和 zepto
jquery 和 zepto 里的 $.extend 方法可以用作深拷貝。
var $ = require('jquery');var newObj = $.extend(true, {}, obj);3、lodash
用 lodash 函數(shù)庫提供的 _.cloneDeep 方法實現(xiàn)深拷貝。
var _ = require('lodash');var newObj = _.cloneDeep(obj);4. 自己封裝
deepClone = (obj) => { let objClone = Array.isArray(obj)?[]:{}; if(obj && typeof obj==="object"){ // for...in 會把繼承的屬性一起遍歷 for(let key in obj){ // 判斷是不是自有屬性,而不是繼承屬性 if(obj.hasOwnProperty(key)){ //判斷ojb子元素是否為對象或數(shù)組,如果是,遞歸復(fù)制 if(obj[key]&&typeof obj[key] ==="object"){ objClone[key] = this.deepClone(obj[key]); }else{ //如果不是,簡單復(fù)制 objClone[key] = obj[key]; } } } } return objClone;}希望本文所述對大家JavaScript程序設(shè)計有所幫助。
新聞熱點
疑難解答