标签：function obj 克隆 对象 JavaScript objects return 拷贝

js克隆一个对象

对象类型在赋值的过程中其实是复制了地址，所以如果改变了一方，其他都会被改变。那么如何克隆一个对象呢？

一、Object.assign

function copy(obj) {
    return Object.assign({}, obj)
}

二、… 运算符

function copy(obj) {
    return { …obj }
}

方法一, 方法二 是浅拷贝，也就是当对象层级大于2层时，复制到的还是地址信息

let a = { age:1,
         jobs: { first: 'tom' } 
        }

let b = copy(a) 
a.jobs.first ='native'

console.log(b.jobs.first) // native

三、JSON

function copy(obj) {
    return JSON.parse(JSON.stringify( obj ));
}

• 会忽略undefined, fn
• 不能序列化函数
• 不能解决循环引用的对象

四、MessageChannel

function structuralClone() {
    return new Promise(resolve =>{
        const {port1,port2} = new MessageChannel()
        port2.onmessage = ev => resolve(ev.data)
        port1.postMessage(obj)
    })
}
obj2  = await structuralClone(obj1);

• 如果对象中有函数，会报错
• 可以解决循环引用的对象
• 异步 await

五、lodash

// 深拷贝
import { cloneDeep, clone } from 'lodash'

var objects = [{ 'a': 1 }, { 'b': 2 }]
 
var deep = cloneDeep(objects)
console.log(deep[0] === objects[0])
// => false

// 浅拷贝
var shallow = clone(objects)
console.log(shallow[0] === objects[0])
// => true

注意: 这个clone方法参考自structured clone algorithm 以及支持 arrays、array buffers、 booleans、 date objects、maps、 numbers， Object 对象, regexes, sets, strings, symbols, 以及 typed arrays。 arguments对象的可枚举属性会拷贝为普通对象。 一些不可拷贝的对象，例如error objects、functions, DOM nodes, 以及 WeakMaps 会返回空对象。

标签：function,obj,克隆,对象,JavaScript,objects,return,拷贝
来源： https://www.cnblogs.com/codebook/p/15379984.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。