关于js深拷贝

开头

面试复习,复习到了深拷贝,记录一下

正文

基本数据类型&复杂数据类型(引用数据类型)

概念

  • 在js种,有2中数据类型:一类是基本数据类型,一类是复杂数据类型;
  • 基本数据类型有:null,undefined,number,string,boolean,symbol(ES6)
  • 复杂数据类型:Object/arrary等

    区别

  • 两者的区别就是在内存中的存储位置不同
  • 前者在栈中存储数据
  • 后者在堆中存储数据,而栈中存储的是数据在堆中存储的位置(引用)

    深拷贝

    作用与复制复杂数据类型时,因为栈中只保存了数据的地址,所以如果只是简单赋值一样的复制,就会出现如下情况(浅拷贝)
    1
    2
    3
    4
    5
    6
    7
    let one={
    one:"this is one"
    }
    let two=one
    console.log(two) // {one:"this is one"}
    one.one=1
    console.log(two) // {one:1}

    深拷贝实现

    思路

  • 判断要复制的目标的数据类型
  • 1.简单数据类型,直接复制
  • 2.复杂数据类型(对象/数组),遍历内部每一项
  • 3.在遍历复杂数据类型内部属性时,会出现情况上面2中情况,再次调用该函数就好(递归)
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    let deepCopy = (copyTarget) => {
    let res = null
    // 返回和复制对象一致的类型
    if (copyTarget instanceof Array) {
    res = []
    } else {
    res = {}
    }
    for (let key in copyTarget) {
    if (typeof copyTarget[key] === 'object' && copyTarget[key] !== null) {
    // 1.复杂数据类型
    console.warn('复杂数据类型')
    res[key] = deepCopy(copyTarget[key])
    } else {
    console.warn('基本数据类型');
    // 2.基本数据类型/和函数
    res[key] = copyTarget[key]
    }
    }
    return res
    }