js_三种方法实现深拷贝

深拷贝（递归）

适用于需要完全独立于原始对象的场景，特别是当对象内部有引用类型时，为了避免修改拷贝后的对象影响到原始对象，就需要使用深拷贝。

// 原始对象
const obj = { uname: 'Lily',age: 19,hobby: ['乒乓球', '篮球'],family:{baby:'老baby'}}// 新对象const o = {} // 拷贝函数function deepCopy(newObj, oldObj) {for(let k in oldObj){// 递归优先级 Array → Object// 判断对象属性是否为数组类型if(oldObj[k] instanceof Array){newObj[k] = []  // newObj[k] === o.hobbydeepCopy(newObj[k], oldObj[k])}else if (oldObj[k] instanceof Object) {newObj[k] = {}  // newObj[k] === o.familydeepCopy(newObj[k], oldObj[k])}else{// newObj[k] === o.unamenewObj[k] = oldObj[k]   }}}deepCopy(o, obj)o.age = 20o.hobby[0] = '足球'o.family.baby = '小baby' console.log(o)   console.log(obj)

在这里插入图片描述

深拷贝( lodash )

Lodash 的 __.cloneDeep 方法可以实现深拷贝，它能够处理各种复杂的数据类型和嵌套结构。

语法规范：_.cloneDeep(value)

// 需要先在src中引入 lodash.min.js 文件
<script src="./js/lodash.min.js"></script>
<script>const obj = {uname:'Lily',age:18,hobby:['乒乓球','足球'],family:{baby: '老baby'}}const o = _.cloneDeep(obj)o.family.baby = '小baby'console.log(o)  console.log(obj) 
</script>

lodash实现深拷贝

深拷贝( JSON )

JSON.stringify() 用于将JavaScript对象或值转换成一个JSON字符串

JSON.parse(text[, reviver]) 将一个符合JSON格式的字符串转换成JavaScript对象或数组

const obj = {uname:'Lily',age:18,hobby:['乒乓球','足球'],family:{baby: '老baby'}}const o = JSON.parse(JSON.stringify(obj))// 将原对象转换成字符串后又转换为对象，这个新对象与原对象无关联console.log(o)o.hobby[0] = '篮球'o.family.baby = '小baby'console.log(obj)