淺度克隆
淺度克隆實際上就是深度克隆第一維變量, 其他維度的變量不進行特殊處理, 當(dāng)克隆出來的對象中有引用類型的屬性, 那么原對象和克隆對象將使用同一個引用值
const obj = {
a: 100,
b: [10, 20, 30],
c: {
x: 10
},
d: /^\d+$/,
e: function () {
console.log(this)
}
}
function clone(obj) {
if (obj instanceof RegExp) return new RegExp(obj)
if (obj instanceof Date) return new Date(obj)
if (typeof obj === 'function') return new Function('return ' + obj)()
if (obj === null || typeof obj !== 'object') return obj
const newObj = new obj.constructor()
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
newObj[key] = obj[key]
}
}
return newObj
}
const newObj = clone(obj)
newObj.c.x = 1000
console.log(obj.c.x) // 1000
深度克隆
深度克隆即克隆出一個值完全與原對象一致的全新對象, 每一個維度都進行深度克隆, 不論改變原對象還是克隆對象, 都不會對對方造成任何影響
深度拷貝的過程中利用遞歸回溯的特點構(gòu)造一個全新的對象
const obj = {
a: 100,
b: [10, 20, 30],
c: {
x: 10
},
d: /^\d+$/,
e: function () {
console.log(this)
}
}
function deepClone(obj) {
if (obj instanceof RegExp) return new RegExp(obj)
if (obj instanceof Date) return new Date(obj)
if (typeof obj === 'function') return new Function('return ' + obj)()
if (obj === null || typeof obj !== 'object') return obj
const newObj = new obj.constructor()
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
newObj[key] = deepClone(obj[key])
}
}
return newObj
}
const newObj = deepClone(obj)
newObj.c.x = 1000
console.log(obj.c.x) // 10
封裝
const obj = {
a: 100,
b: [10, 20, 30],
c: {
x: 10
},
d: /^\d+$/,
e: function () {
console.log(this)
}
}
function clone(obj) {
const isDeepClone = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false
if (obj instanceof RegExp) return new RegExp(obj)
if (obj instanceof Date) return new Date(obj)
if (typeof obj === 'function') return new Function('return ' + obj)()
if (obj === null || typeof obj !== 'object') return obj
const newObj = new obj.constructor()
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
newObj[key] = isDeepClone ? clone(obj[key], isDeepClone) : obj[key]
}
}
return newObj
}
const newObj1 = clone(obj) // 淺度克隆
const newObj2 = clone(obj, true) // 深度克隆
