JS对象复制(深拷贝和浅拷贝)
⽬录
⼀、浅拷贝
1、Object.assign(target,)
2、扩展运算符(spread)
⼆、深拷贝
1、使⽤对象序列化 JSON.stringify()和JSON.parse()
2、使⽤递归,对对象属性进⾏判断
⼀、浅拷贝
1、Object.assign(target,)
a、可⽀持多个对象复制
b、如果source和target属性相同 source会复制target的属性
c、target只能为Object对象
var obj = {a:1,b:2}
undefined
Object.assign({c:3},obj)
{c: 3, a: 1, b: 2}
obj
{a: 1, b: 2}
兼容性写法if(Object.assign){//兼容}else{//不兼容}
2、扩展运算符(spread)
⽀持将多个对象复制到⼀个对象上“
var obj1 = { foo: "foo" };
var obj2 = { bar: "bar" };
var copySpread = { ...obj1, ...obj2 }; // Object {foo: "foo", bar: "bar"}
copySpread
{foo: "foo", bar: "bar"}
var obj = {a:1,b:2,c:3}
var objs = {...obj}
objs
{a: 1, b: 2, c: 3}
objs.a=10
10
objs
{a: 10, b: 2, c: 3}
obj
{a: 1, b: 2, c: 3}
⼆、深拷贝
1、使⽤对象序列化 JSON.stringify()和JSON.parse()
注意:此⽅法仅在原对象包含可序列化值类型且没有任何循环引⽤时才有效。不可序列化值类型的⼀个例⼦是Date对象 -JSON.parse只能将其解析为字符串⽽⽆法解析回其原始的Date对象或者对象中属性值为function
var obj = {a:1,b:[1,2,3],c:{e:3},bool:false}
undefined
var objs = JSON.parse(JSON.stringify(obj))
undefined
objs
{a: 1, b: Array(3), c: {…}, bool: false}
objs.bool = true
true
objs
{a: 1, b: Array(3), c: {…}, bool: true}
obj
{a: 1, b: Array(3), c: {…}, bool: false}
2、使⽤递归,对对象属性进⾏判断
function deepClone(obj) {
var copy;
// 如果 obj 是 null、undefined 或不是对象,直接返回 obj
// Handle the 3 simple types, and null or undefined
if (null == obj || "object" != typeof obj) return obj;
// Handle Date
if (obj instanceof Date) {
copy = new Date();
copy.Time());
return copy;
}
// Handle Array
if (obj instanceof Array) {
copy = [];
for (var i = 0, len = obj.length; i < len; i++) {
copy[i] = clone(obj[i]);
}
return copy;
js assign}
// Handle Function
if (obj instanceof Function) {
copy = function() {
return obj.apply(this, arguments);
}
return copy;
}
// Handle Object
if (obj instanceof Object) {
copy = {};
for (var attr in obj) {
if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
}
return copy;
}
throw new Error("Unable to copy obj as type isn't supported " + structor.name);
}
以上就是JS对象复制(深拷贝和浅拷贝)的详细内容,更多关于JS的资料请关注其它相关⽂章!

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。