前言
最近在复习JS的基础内容,看到了关于JS中值类型和引用类型的问题,这类问题也经常会出现在面试的问题中,结合自己的理解记录一下
一、什么是值类型和引用类型?
我们先来看两个例题:
值类型:
这个大家应该都能理解,比较直观的逻辑,打印的b结果为100
引用类型:
a赋值成一个对象age:20,b赋值为a,b.age赋值为21,最后打印a.age的值也为21
区别: 值类型各自赋值,不会相互干扰;引用类型上面b改变了a也会随之改变
二、深入分析
上面举了两个例子说明值类型和引用类型的区别,那么为什么会出现这样的结果呢,下面还是以刚才的两个例子来进一步的深入分析:
1.值类型
值类型都是通过栈进行存储的:
- 第一步:把a赋值成100
- 第二步:把b赋值为a,也是等于100
- 第三步,把a赋值为100,a和b互不影响,b的值仍未100
2.引用类型
这里除了上面的栈,还引入了一个新的概念堆。在计算机的存储中,栈从上往下排列,堆从下往上排列,一般不会重合。来看一下上面例子的存储过程:
- 第一步:给age赋值成一个等于20的对象,他的key会给一个内存地址一,此时变量a指向的是一个内存地址1,也就是说a里面存储的并不是这个对象,而是存入了内存地址指向这个对象
- 第二步:a指向内存地址一,b也指向内存地址一,看似a等于age:20,b也等于age:20
- 第三步:b.age等于21的话,肯定会把下面的对象改为age:21,因为a指向的也是这个地址,所以a.age也是21
三、值类型和引用类型有哪些
值类型:
undefined,string,number,布尔类型, Symbol类型
引用类型:
对象,数组
null也是特殊的引用类型,指针指向空地址
函数也是特殊的引用类型,但不用来存储数据
四、总结
看了上面的一个存储过程,是不是对值类型和引用类型的赋值过程更清楚了呢,那么为什么值类型和引用类型会以这种方式进行赋值呢?主要原因还是计算机考虑到性能和存储的问题:
- 值类型,的内存占用比较小,所以可以直接进行赋值没有问题,不会对系统造成很大的影响
- 引用类型则不一样,虽这里是age:20,但是一个json可能非常的大,如果直接赋值会使速度非常慢
有没有什么办法能像赋值值类型一样,将引用类型也去以这种方式赋值呢?这里就涉及到JS深拷贝的内容,这里就不做叙述了
关于 JS 深拷贝的使用及理解,大家可以移步 JS深拷贝的前因后果
如果对你有帮助,点赞支持谢谢~