数据类型
基本类型: Boolean、Number、String、Null、Undefined、Symbol
var num1 = 1;
var num2 = num1;
// num1: 1
// num2: 1
num2 = 2;
// num1: 1
// num2: 2
引用类型: Object
var obj1 = {x: 1, y: 2};
var obj2 = obj1;
// obj1: {x: 1, y: 2}
// obj2: {x: 1, y: 2}
obj2.x = 2;
// obj1: {x: 2, y: 2}
// obj2: {x: 2, y: 2}
浅拷贝(Shallow Copy)、深拷贝(Deep Copy)只存在于引用类型中 (基本数据类型是按值访问的,操作保存的是实际的值)
区别:是否是真正获取了一个对象的复制实体,而不是引用。
赋值: 只复制了指向对象的指针,改变对象会互相影响。
浅拷贝: 只复制对象一层,改变引用对象还会互相影响。
深拷贝: 完全复制对象的值,改变对象不会互相影响。
浅拷贝
Array
1、arrayObject.slice(start, end) : 可以从数组中start下标开始取值,直到end下标结束(不包括),返回一个新数组。
2、arrayObject.concat([params]); 连接值或数组,返回一个新的数组。
3、展开运算符
let arr1 = ['a', 'b'];
let arr2 = [...arr1];
4、
function shallowCopy(src) {
var tar = [];
for (var prop in src) {
if (src.hasOwnProperty(prop)) {
tar[prop] = src[prop];
}
}
return tar;
}
Object
1、Object.assign(target, source, ...) : 用于合并/复制对象的属性,将多个源对象复制合并到目标对象,并返回目标对象。
2、展开运算符
let obj1 = {x:1, y:2};
let obj2 = {...obj1};
console.log(obj2); // {x: 1, y: 2}
3、
function shallowCopy(src) {
var tar = {};
for (var prop in src) {
if (src.hasOwnProperty(prop)) {
tar[prop] = src[prop];
}
}
return tar;
}
深拷贝
Object
1、JSON.parse(JSON.stringify(obj))
缺点:undefined、任意的函数以及 symbol 值,在序列化过程中会被忽略(出现在非数组对象的属性值中时)或者被转换成 null(出现在数组中时)。
局限性: 不能深拷贝含有undefined、function、symbol值的对象。
2、lodash库
import _ from 'lodash'
var obj1 = {
a: 1,
b: { f: { g: 1 } },
c: [1, 2, 3]
};
var obj2 = _.cloneDeep(obj1);
console.log(obj1.b.f === obj2.b.f);
// false
3、jQuery
var obj1 = {
a: 1,
b: { f: { g: 1 } },
c: [1, 2, 3]
};
var obj2 = $.extend(true, {}, obj1);
console.log(obj1.b.f === obj2.b.f);
// false
4、递归
方式一
function deepCopy(obj) {
let result = {};
let keys = Object.keys(obj);
let key = null;
let value = null;
for (let i = 0; i < keys.length; i++) {
key = keys[i];
value = obj[key];
// 如果字段的值也是一个对象则递归操作
if (value && typeof value === 'object') {
result[key] = deepCopy(value);
} else {
// 否则直接赋值给新对象
result[key] = value;
}
}
return result;
}
方式二
function deepCopy(obj) {
let result = {};
for(let key in obj){
if(typeof obj[key] === 'object'){
result[key] = deepCopy(obj[key]);
}else{
result[key] = obj[key];
}
}
return result;
}