浅拷贝:Array.prototype.concat()拷贝数组,Object.assign() 拷贝对象
1.两个方法都只是浅拷贝,只拷贝第一级,第二级以上只拷贝地址。例如 obj2.b.c改变时,原对象和新对象的值都会改变。
- 两个方法都是按顺序进行合并,但是 Object.assgin 会把重复的属性进行保留最新值的操作,concat 不会
- concat 会创建一个新的数组(第一级拷贝)。而 Object.assgin 则是把第一个参数对象当成操作对象,把其他参数对象的属性往它身上进行合并,不会创建新对象,是对第一个参数对象的直接操作
- 不会继承有参与合并对象“本身”及“原型对象”上的方法和属性。
深拷贝:let obj3 = JSON.parse(JSON.stringify(obj1));
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>a</title>
<style type="text/css">
#main{width:300px;height:200px;}
</style>
</head>
<body>
<script>
// function test() {
// 'use strict';
// 浅拷贝
let obj1 = { a: 0 , b: { c: 0}};
let obj2 = Object.assign({}, obj1);
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
obj1.a = 1;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
obj2.a = 2;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}
obj2.b.c = 3;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}}
// 深拷贝
obj1 = { a: 0 , b: { c: 0}};
let obj3 = JSON.parse(JSON.stringify(obj1));
obj1.a = 4;
obj1.b.c = 4;
console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}
</script>
</body>
</html>