js deepClone 深拷贝主要用于对象、数组等拷贝后,操作拷贝的数据不影响原数据。下面分享两种方法,都可实现:
1、通过Object.create和Object.defineProperty取对象的所有属性,返回一个新的对象:
function deepClone(orig) { var copy = Object.create(Object.getPrototypeOf(orig)) copyOwnPropertiesFrom(copy,orig); return copy; } function copyOwnPropertiesFrom(target, source) { Object.getOwnPropertyNames(source) .forEach(ele =>{ // 获取到每个属性的所有描述,然后重新定义对象的属性并返回此对象。 var desc = Object.getOwnPropertyDescriptor(source,ele); Object.defineProperty(target,ele,desc) }); return target; } deepClone(obj)
2、递归遍历对象的属性,返回一个新的对象
function deepClone(obj) { // 方法一 // let newObj = obj.constructor === Array ? [] : {} // if(typeof obj !== 'object') { // return obj // }else{ // for(var i in obj) { // if(typeof obj[i] === 'object'){ // newObj[i] = deepClone(obj[i]) // }else{ // newObj[i] = obj[i] // } // } // } // return newObj; // 方法二 if (!obj && typeof obj !== "object") { throw new Error("error arguments", "deepClone"); } const targetObj = obj.constructor === Array ? [] : {}; Object.keys(obj).forEach(keys => { if (obj[keys] && typeof obj[keys] === "object") { targetObj[keys] = deepClone(obj[keys]); } else { targetObj[keys] = obj[keys]; } }); return targetObj; }
注:此方法对new Date()、/\s|\n/g 等这种时间和正则对象无效
当然还有其他方法实现,这里仅介绍这两种比较简单的实现方式。