深拷贝、浅拷贝

首先我们先学习一下深拷贝和浅拷贝的数据类型都有哪些？

• 基本数据类型：检测类型typeof()

Undefined、Null、Boolean、Number、String、Symbol (new in ES 6) ！

• 引用类型：instanceof

除过上面的 6 种基本数据类型外，剩下的就是引用类型了，统称为Object 类型。细分的话，有：Object 类型、Array 类型、Date 类型、RegExp 类型、Function 类型等

深拷贝：就是在原有的数据上在复制一份，开辟一个新的空间
浅拷贝：就是复制了一份，没有新开辟

深拷贝、浅拷贝

前端数据交互赋值的时候很容易遇到深拷贝浅拷贝的问题，就会导致数据的耦合，今天来用一组代码来讲解一下

<script>
    var json = { a: 123, b: '456' };
    console.log(json)
    var json2 = json
    json2.a=222
    console.log(json2)
</script>

打印出来的结果应该如下：

image.png

虽然表面看我们的数据没有任何变化，但是当我们打开数据的时候就会发现如下结果：

image.png

我们json中的数据被影响了,
解决方案如下：

<script>
    var json = { a: 123, b: '456' };
    console.log(json)
    var json2 = JSON.parse(JSON.stringify(json));
    json2.a=222
    console.log(json2)
</script>

我们将数组中的值先JSON.stringify()转义一下，之后使用JSON.parse赋值给json2，我们可以理解为一个新的数组，在json2中的值进行修改就不会影响到原json中的值，这样就解决了深拷贝的问题

image.png

JQ中也提供了一个深拷贝方法，代码如下：

<script>
    var json = { a: 123, b: '456' };
    console.log(json)
    var json2 = $.extend(true, {}, json);
    json2.a=222
    console.log(json2)
</script>

image.png