JavaScript基础----数组的深拷贝与浅拷贝

前段时间面试, 面试官上来就问数组的深浅拷贝问题, 今天有时间, 刚好来总结一下.

首先, 什么是深拷贝和浅拷贝呢? JS中数据类型分为基本数据类型和引用数据类型，基本类型存放在栈中，存的是值; 引用类型存放在堆中, 存的是地址。只有引用数据类型才有深拷贝、浅拷贝的概念

深拷贝: 深拷贝是指, 在计算机中开辟了一块内存地址用于存放复制的对象, 新对象与原对象不会相互影响;

浅拷贝: 浅拷贝是指复制的是对象的内存地址，如果原地址中对象被改变了，那么浅拷贝出来的对象也会相应改变。

那么数组的方法中, 哪些是深拷贝, 哪些是浅拷贝呢, 下面来列举一下:

//slice方法
let arr = ["hello", { a: "world", b: 21 }, ["Bob", "Tom", "Jenny"]];
let arr1 = arr.slice();
arr[0] = "world";
arr[1].a = "aaa";
arr[2][0] = "Tony";
console.log(arr1, arr[1] === arr1[1], arr[2] === arr1[2]);  
//["hello", { a: "aaa", b: 21 }, ["Tony", "Tom", "Jenny"]], true, true


//concat方法
let arr = ["hello", { a: "world", b: 21 }, ["Bob", "Tom", "Jenny"]];
let arr1 = arr.concat([]);
arr[0] = "world";
arr[1].a = "aaa";
arr[2][0] = "Tony";
console.log(arr1, arr[1] === arr1[1], arr[2] === arr1[2]);  
//["hello", { a: "aaa", b: 21 }, ["Tony", "Tom", "Jenny"]], true, true


//...方法
let arr = ["hello", { a: "world", b: 21 }, ["Bob", "Tom", "Jenny"]];
let arr1 = [...arr];
arr[0] = "world";
arr[1].a = "aaa";
arr[2][0] = "Tony";
console.log(arr1, arr[1] === arr1[1], arr[2] === arr1[2]);  
//["hello", { a: "aaa", b: 21 }, ["Tony", "Tom", "Jenny"]], true, true

	深拷贝 or 浅拷贝
slice	如果数组是一个元素全为基础类型的一维数组, 那么就是深拷贝, 否则就是浅拷贝
concat	如果数组是一个元素全为基础类型的一维数组, 那么就是深拷贝, 否则就是浅拷贝
[...arr]	如果数组是一个元素全为基础类型的一维数组, 那么就是深拷贝, 否则就是浅拷贝