我们知道,对象类型在赋值的过程中其实是复制了地址,所以如果改变了一方,其他都会被改变。我们应该如何克隆一个对象,并且避免这种现象的发生呢?

方法一:Object.assign

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

方法二:…展开运算符

function copy(obj){
return { …obj };
}
方法一,方法二是浅拷贝,也就是当对象层级大于2层时,复制到的还是地址信息
let a = {age:1,
jobs: {first:'FE’}
}
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

js克隆一个对象的更多相关文章

  1. 使用js判断一个对象是否为空 比如 obj={}

    今天使用到js判断一个对象是否为空,js没有封装好的方法,这里最好的办法就是使用jquery里面的封装好的方法 $.isEmptyObject(obj)

  2. javascript克隆一个对象

    /* * 克隆一个对象 */ com.ty.repairtech.JsonOperation.clone = function(obj) { // Handle the 3 simple types, ...

  3. js 克隆数组

    js克隆数组 1.遍历push 2.slice const a1 = [1, 2];const a2 = a1.slice() 3.concat() const a2 = a1.concat(); a ...

  4. 如何用js判断一个对象是不是Array

    .如何用js判断一个对象是不是Array 1.Array.isArray(obj) 调用数组的isArray方法 2.obj instanceof Array 判断对象是否是Array的实例 3.Ob ...

  5. js实现克隆一个对象

    var app={}; app.cloneobj= function(obj){ var o; if(typeof obj == "object"){ if(obj===null) ...

  6. js克隆

    一.有什么用 不破坏原对象的属性 引入一些概念~ 原始数据类型(5种):undefined.null.number.string.boolean 引用数据类型(1种,也叫复合数据类型):object ...

  7. js判断一个对象{}是否为空对象,没有任何属性

    // js如何判断一个对象{}是否为空对象,没有任何属性 if (typeof model.rows === "object" && !(model.rows in ...

  8. JS 克隆Object.prototype.Clone

    我们知道,在js中,当object作为参数传递到函数中进行处理后,实际上是修改了传入的对象本身(或者说是对象的引用),但很多时候我们并不希望函数去修改我们的这些对象参数,这就需要使用到对象的克隆,我们 ...

  9. js new一个对象的过程,实现一个简单的new方法

    对于大部分前端开发者而言,new一个构造函数或类得到对应实例,是非常普遍的操作了.下面的例子中分别通过构造函数与class类实现了一个简单的创建实例的过程. // ES5构造函数 let Parent ...

随机推荐

  1. Linux忘记 root密码的解决办法

    很多朋友经常会忘记Linux系统的root密码,linux系统忘记root密码的情况该怎么办呢?重新安装系统吗?当然不用!进入单用户模式更改一下root密码即可. 步骤如下: 重启linux系统 重启 ...

  2. asp.net中正则表达式使用

    一.限定符:限定符提供了一种简单方法,用于指定允许特定字符或字符集自身重复出现的次数.限定符始终引用限定符前(左边)的模式,通常是单个字符,除非使用括号创建模式组. (一)非显示限定符 1. *,描述 ...

  3. Keep-Alive 以及服务器心跳

    Keep-Alive 来源 :http://www.nowamagic.net/academy/detail/23350305 服务器心跳  来源 :http://www.cnblogs.com/lw ...

  4. ADO.NET中sqlserver和mysql的变量名

    因为ADO.NET标配是访问SQL SERVER数据库,那么如果需要访问MySQL数据库,那么ADO.NET五个对象也必须转换. 访问 SQL SERVER 的ADO.NET对象 1.SqlConne ...

  5. pytorch怎么入门学习

    pytorch怎么入门学习 https://www.zhihu.com/question/55720139

  6. 题解【洛谷P1938】 [USACO09NOV]找工就业Job Hunt

    题面 题解 将路径连边\((x, y, d)\) ,将航线连边\((x, y, d - w)\).其中线路是从\(x\)到\(y\),航线的费用为\(w\),\(d\)的含义如题面. 跑一遍\(SPF ...

  7. gnuplot 让您的数据可视化

    https://www.ibm.com/developerworks/cn/linux/l-gnuplot/index.html http://blog.sciencenet.cn/blog-3733 ...

  8. 找不到方法:'System.Net.Http.HttpRequestMessage System.Web.Http.Controllers.HttpActionContext.get_Request()'

    出现这种情况一般是引用了.net standard 库解决方案1:在web.config 文件中增加如下节点 <dependentAssembly> <assemblyIdentit ...

  9. 对C#面向对象三大特性的一点总结

    一.三大特性 封装: 把客观事物封装成类,并把类内部的实现隐藏,以保证数据的完整性 继承:通过继承可以复用父类的代码 多态:允许将子对象赋值给父对象的一种能力 二.[封装]特性 把类内部的数据隐藏,不 ...

  10. 对C#单例模式的理解

    2018年11月6日       小雨 一.单例模式的定义 确保一个类只有一个实例,并提供一个全局访问点来访问这个唯一的实例,是一种对象创建型模式,有如下3个要点: 只能有一个实例 必须是自行创建这个 ...