解决浅拷贝的五种方式

已被阅读 1048 次 | 文章分类:javascript | 2022-02-24 22:48

浅拷贝和深拷贝以及值类型、引用类型概念理解请移步http://xiaobaigis.com/Home/WebArticle?ID=99;浅拷贝 其实很好理解;就是复制对象不彻底,修改复制后的对象,会影响到原对象;

1 Object.assign()

利用对象合并的方法;返回一个新对象

                                            
var obj1 = {a: 10, b: 20};
var obj2 = Object.assign({}, obj1);
                                            
                                        

/net/upload/image/20220224/d2158e3e-b8f0-436d-9fb3-2c99d907774d.png

2 对象的解构赋值

利用扩展运算符

                                            
var obj1 = {a: 10, b: 20};
var obj2 = {...obj1};
                                            
                                        

/net/upload/image/20220224/d56eed6ec3434aad9aeb1ab7b96dd632.png

3 JSON.stringify和JSON.parse

利用JSON的序列化和解析方式;先通过序列化转成字符串,复制字符串后再解析成对象;因为字符串是值类型,不存在浅拷贝的问题。

                                            
function deepClone(obj) {
  var _obj = JSON.stringify(obj),
    objClone = JSON.parse(_obj);
  return objClone;
}
                                            
                                        

/net/upload/image/20220224/7c5f6d1977934f4585f09a847be5c053.png

4 Array.slice

如果对象是数组的话,可以利用slice方法.

/net/upload/image/20220224/2f62c36934cb410281734542c841809d.png

5 Array.contact()

如果对象是数组的话,可以利用concat方法.​​​​​​​

/net/upload/image/20220224/5053c1c4a44549eeab3f4fdfd9d315dd.png

QQ:3410192267 | 技术支持 微信:popstarqqsmall

Copyright ©2017 xiaobaigis.com . 版权所有 鲁ICP备17027716号