2019-01-29 对象拷贝

oldObj = {
  prop: 'old',
  sonObj: {
    name: 'old'
  }
}

已经分不清什么浅拷贝了

浅拷贝

newObj111 = oldObj

一级拷贝

newObj222 = Object.assign({}, oldObj,{prop1: '1'})      // sunObj 仍然引用的地址
newObj222.__proto__
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

newObj333 = Object.create(oldObj)  // 创建的对象拥有明确的原型
newObj333.__proto__
// {name: "xiaoming", age: 23, sonObj: {…}}age: 23name: "xiaoming"sonObj: {name: 3}__proto__: Object
underscore
var obj = _.cloneDeep(oldObj);

深拷贝

json 装换
// 不能转换 function 和 regExp
var obj1 = { fun: function(){ console.log(123) } };
var obj2 = JSON.parse(JSON.stringify(obj1));
// {}
函数
function deepClone (oldObj) {
  let newObj = {}
  for (let i in oldObj) {
    const value = oldObj[i]
    if (typeof value === 'Object' || typeof value === 'Array') {
        newObj[i] = deepCopy(value)
    } else {
        newObj[i] = oldObj[i]
    }
  }
  return newObj
}
newObj444 = deepClone(oldObj)
函数改版(最佳实践)

jQuery
var obj = $.extend(true, {}, oldObj);
Lodash
var obj = _.cloneDeep(oldObj);

内容浅显,欢迎纠错补充

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 写在前面 各类技术论坛关于深拷贝的博客有很多,有些写的也比我好,那为什么我还要坚持写这篇博客呢,之前看到的一篇博客...
    心_c2a2阅读 21,340评论 3 18
  • 对象拷贝是在js中最基本的对象操作。 浅拷贝 浅复制仅仅复制嵌套对象的地址: 拷贝需要注意的问题有很多: 需要拷贝...
    csRyan阅读 5,434评论 1 2
  • 值类型与引用类型 谈浅拷贝与深拷贝之前,我们需要先理清一个概念,即值类型与引用类型。 什么是值类型与引用类型?这要...
    franose阅读 3,723评论 1 8
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,078评论 1 45
  • 面试的时候,经常会被问到js的浅拷贝和深拷贝问题,很多时候能够想清楚是怎么回事,但是实在描述不出来,可能还是自己比...
    肆意咯咯咯阅读 2,795评论 0 3