深浅拷贝

2019-04-13  本文已影响0人  frameworkofthin

前置知识

基本类型直接存储于栈内存中
对象类型的值存储于堆内存中,对象的属性值存储的只是它的堆内存的地址(指针)。

什么是浅拷贝?什么是深拷贝?

如何实现浅拷贝?

let a = {
  name: '张三',
  job: {
    name: '腾讯'
  }
}
// 第一种:利用es6的Object.assign()
let b = Object.assign({}, a)
// 第二种:利用扩展运算符...
let c = { ...a }
// 第三种
function shallowClone (obj) {
  function isObject(obj) {
    console.log(typeof obj)
    return typeof obj === 'object' || typeof obj === 'function' && typeof obj !== null
  }

  if (!isObject(obj)) {
    throw new Error('不是对象')
  }

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

如何实现深拷贝?

JSON序列化
let a = {
  name: '张三',
  job: {
    name: '腾讯'
  }
}
// 第一种
JSON.parse(JSON.stringify())

该方法有以下的局限:

简易版深拷贝
function deepClone (obj) {
  function isObject(obj) {
    return typeof obj === 'object' || typeof obj === 'function' && typeof obj !== null
  }

  if (!isObject(obj)) {
    throw new Error('不是对象')
  }

  let newObj = Array.isArray(obj) ? [...obj] : { ...obj }
  Object.keys(newObj).forEach(key => {
    const oldValue = obj[key]
    newObj[key] = isObject(oldValue) ? deepClone(oldValue) : oldValue
  })

  return newObj
}

参考链接:https://juejin.im/post/5b5dcf8351882519790c9a2e

上一篇 下一篇

猜你喜欢

热点阅读