深拷贝的实现-CSDN博客

本文链接：https://blog.csdn.net/lyc1cccccccc/article/details/130935034

JavaScript深拷贝的实现;

这里记录一下手写递归的方式实现深拷贝

创建克隆函数

function cloneDeep(obj) {
  
}

函数内创建一个变量; 用来接数据

let newObj = null

判断传入的参数是不是引用数据类型; 并且不是空的; 满足的条件执行if内的语句

if (typeof obj === 'object' && obj !== null) {}

if内判断这个引用数据外层是数组还是对象;

newObj = Array.isArray(obj) ? [] : {}

if内进行遍历; 上一句的下面

for (const k in obj) {}

目前的结构是这样:

// 1: 创建克隆函数
        function cloneDeep(obj) {
            // 2: 创建一个变量; 用来接数据
            let newObj = null
            // 3: 判断传入的参数是不是引用数据类型; 并且不是空的; 满足的条件执行if内的语句
            if (typeof obj === 'object' && obj !== null) {
                // 4: 判断这个引用数据外层是数组还是对象; 
                newObj = Array.isArray(obj) ? [] : {}
                // 5: 进行遍历
                for (const k in obj) {
                   
                }
            } else { //当传入的基本数据时; 拷贝数据, 返回外层
                return newObj = obj
            }
        }

遍历内不能直接进行赋值; 要再调用自身克隆函数, 直到基本数据类型return出来;注意这里cloneDeep()参数要传遍历取出来的数据

newObj[k] = cloneDeep(obj[k])

else语句; 当传入的基本数据时; 拷贝数据, 返回外层;

else { // 7: 当传入的基本数据时; 拷贝数据, 返回外层
      return newObj = obj
}

这样代码就写完了, 实现深拷贝功能

全部代码如下

// 1: 创建克隆函数
        function cloneDeep(obj) {
            // 2: 创建一个变量; 用来接数据
            let newObj = null
            // 3: 判断传入的参数是不是引用数据类型; 并且不是空的; 满足的条件执行if内的语句
            if (typeof obj === 'object' && obj !== null) {
                // 4: 判断这个引用数据外层是数组还是对象; 
                newObj = Array.isArray(obj) ? [] : {}
                // 5: 进行遍历
                for (const k in obj) {
                    // 6: 遍历内不能直接进行赋值; 要再调用自身克隆函数, 直到基本数据类型return出来
                    // 注意这里cloneDeep()参数要传遍历取出来的数据
                    newObj[k] = cloneDeep(obj[k])
                }
            } else { // 7: 当传入的基本数据时; 拷贝数据, 返回外层
                return newObj = obj
            }
        }