前端面试题，2周刷100道， 19 深拷贝的详细解读

实现一个 深拷贝函数

使用JSON。stringify 和 parse

在内容比较简单的时候，这个是很使用的 但是存在以下的问题

无法转换 函数 无法转换 Map Set 无法转换 循环引用

下面用代码自己实现一个

/**
 * 实现一个简单的 ， 只考虑 数组和对象
 */

function deepClone (obj: any) {
  // 简单类型 直接返回
  if (typeof obj != 'object' || obj === null) return obj

  let result: any
  if (obj instanceof Array) {
    result = []
  }else {
    result = {}
  }
  for(let key in obj) {
    if (obj.hasOwnProperty(key)) {
      result[key] = deepClone(obj[key])
    }
  }
  return result
}


/**
 * 考虑 数组 对象 Map Set
 * 考虑 循环引用
 * @param obj  obj
 * @param map  WeakMap避免循环引用
 */


function cloneDeep(obj: any, map = new WeakMap()):any {
  if (typeof obj != 'object' || obj == null) return obj

  // 避免循环引用
  const objFromMap = map.get(obj)
  if (objFromMap) return objFromMap

  let target: any = {}
  map.set(obj, target)


  // Map
  if (obj instanceof Map) {
    target = new Map()
    obj.forEach((v,k) => {
      const v1 = cloneDeep(v,map)
      const k1 = cloneDeep(k,map)
      target.set(k1, v1)
    })
  }

  // Set
  if (obj instanceof Set) {
    target = new Set()
    obj.forEach((v) => {
      const v1 = cloneDeep(v, map)
      target.add(v1)
    })
  }
  // Array
  if (obj instanceof Array) {
    target = obj.map(item => cloneDeep(item, map))

  }
  // Object
  for(let key in obj) {
    const val = obj[key]
    const val1 = cloneDeep(val, map)
    target[key] = val1
  }
  return target
}

2周刷完100道前端优质面试真题 mu课 视频及资料领取请关注：奋斗的刚子

也欢迎使用我的小程序