还在为浅拷贝深拷贝的面试题犯难?

“由基本数据类型和引用数据类型延申的一系列知识点”

说到浅拷贝和深拷贝之前，我们首先不得不说明一JS的两种数据类型：基本数据类型、引用数据类型以及他们的区别。

—

基本数据类型、引用数据类型

基本数据类型：Number, String, Boolean, Undefined , Null , Object， Symbol（ES6） 引用数据类型：Object，如Object、Array、Function等。

区别：存储方式的不同，基本数据类型的值存在栈（statck），引用数据在栈中存储一个地址，根据这个地址去堆（heap）中找它的值，这种访问方式也被称为“引用访问”。

例1：

// 基本数据类型
let a = 1
let b = a
b = 2
console.log(a, b) // 1,2

如图所示：基本数据类型是在栈中直接存储的原始的值，遵从着一对一的原则，所以虽然我们在代码中把a赋值给了b，但其实只是把a的值复制了一份给了b，而a跟b之间是相互独立且互不影响的，就好比 sw**.avi 和 sw**(1)副本.avi 的区别（有些人：你早举这个例子，我不就懂了吗？）。

640 (1).png

例2：

let obj1 = { 'name': 'blucesun' }
let obj2 = obj1
obj2.name = 'jack'
console.log(obj1) // { 'name': 'jack' }
console.log(obj1 === obj2) // true

640 (2).png

如图所示：引用数据类型在栈中存储一个地址，该地址指向堆内存中的引用值。 当 let obj2 = obj1 时，可以看到我们把obj1存的地址复制了一份给了obj2，但是他们都指向同一个地址，这就是指针，由此我们可想而知，正因为两个变量同时指向一个地址，所以当这两个变量中的任意一个，对堆中的值进行操作时，那么操作后的结果对于二者来说是一致的。

再打个比方，当你把你珍藏已久的http://www.****.com 发给你的上铺的时候，你们同时拥有指向同一个网站的地址，但是有一天你们因为网速的占用而吵架了，你一气之下，举报了该网站，该网站因此而被查封，此时你们两个人都将不再能够访问（不成熟的栗子，仅帮助理解，一笑而过即可）。

640 (4).png

—

浅拷贝、深拷贝

某网友A：你还知道回到正轨啊？😒

某网友B：车别....别停！😍

我：车一会再开😂，先说正题。就拿引用数据来说，其实上文已经说明了浅拷贝的情况，相信认真看的同学已经参透其中的玄机（某网友A：老子根本没看，直接过来的😒。我：......）。浅拷贝：在上文中obj1 和 obj2 同时指向同一个内存地址中的值，所以二者任意一个对堆内存中的值进行操作时，都会影响到另一个，这就是浅拷贝，就这么简单。

深拷贝：当我们通过一些深拷贝的方法将 obj1 拷贝给obj2的时候（如：递归、let obj2 = JSON.parse(JSON.stringify(obj1))等，这里不多加赘述），这时候js会在堆内存中另外分配一块内存，并给予obj2一个可以指向该内存的地址。此时的obj1 和 obj2 虽然在堆内存中的值一样，但是他们所属的内存地址是不一样的，也就是说，他们在堆中是相互独立且互不影响的。

let obj1 = {'name': 'blucesun'}
let obj2 = JSON.parse(JSON.stringify(obj1))
console.log(obj1 === obj2) // false
obj2.name = 'jack'
console.log(obj1,obj2) // {'name': 'blucesun'},{'name': 'jack'}

640 (5).png

640 (6).png

—