前言

最近在写ES6的文章的时候发现重复遇到关于javascript深拷贝和浅拷贝的问题，然后查找了一些资料，根据资料和自己的理解做了以下笔记，毕竟javascript关于深拷贝和浅拷贝的问题在一些面试的时候有些面试官可能会进行提问，一起来看看吧！

数据类型

在了解浅拷贝和深拷贝之前，我们先回顾一下javascript中的数据类型，因为在讲浅拷贝和深拷贝的时候就是就是对原始数据类型(基本数据类型)和对象数据类型(引用数据类型)的拷贝

在javascript中，我们将数据类型分为两种，原始数据类型(基本数据类型)和对象类型(引用数据类型)

基本数据类型

基本数据类型的值是按值访问的，基本数据类型的值是不可变的

常见的基本数据类型：Number,String,Boolean,Undefined,Null

引用数据类型

引用类型的值是按引用访问的，引用类型的值是动态可变的

常见的引用类型：Object,Function,Array

由于数据类型的访问方式不同，它们的比较方式也是不一样的,我们来看一下下面的示例

(1)基本数据类型和引用数据类型的比较

复制代码
<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title>深拷贝和浅拷贝入门</title>    </head>    <body>        <script type="text/javascript">            var a=100;             var b=100;             console.log(a===b);//true            var c={a:1,b:2};             var d={a:1,b:2};             console.log(c===d);//false        </script>    </body></html>
复制代码

总结

  • 基本数据类型的比较是值的比较，所以在示例中a===b为true
  • 引用类型的比较是引用地址的比较,所以在示例c===d为false,因为c和d的地址不同

鉴于综上两点我们大概知道所谓的浅拷贝和深拷贝可能就是对于值的拷贝和引用的拷贝(基本数据类型都是对值的拷贝)，在这里主要讲解关于引用类型的拷贝

浅拷贝

浅拷贝是对象共用一个内存地址，对象的变化相互影响。比如常见的赋值引用就是浅拷贝

(1)简单对象的浅拷贝

复制代码
<!DOCTYPE html><html>    <<