对前端感兴趣的可以关注一下我的博客,会持续更新前端相关的知识和学习笔记,一起学习。
JavaScript中的数据类型分为基本数据类型和引用数据类型,那么哪些是基本类型,哪些是引用类型,以及它们的区别是什么呢?
基本数据类型
基本数据类型共有6种,包括String、Number、Boolean、Null、undefined以及ES6新增的Symbol。
引用数据类型
引用数据类型就是除基本数据类型外的数据,即Object对象类型,Array、Function、RegExp、Date都是对象类型。
基本数据类型与引用数据类型的区别
认识了基本数据类型与引用数据类型,那么它们之间有什么区别呢?
基本数据类型存储在栈(Stack)内存中,引用数据类型存储在堆(Heap)内存中。
基本数据类型存放在栈中,是一段简单的数据段,数据大小确定,内存空间大小可以分配,是直接按值存放的,可以按值访问。
引用数据类型存放在堆中,变量在栈中保存的是指向堆内存的地址值,这个地址值指向对应的对象类型,访问堆内存中的对象是通过地址值访问的。
下图表示基本类型和引用类型在内存中的存放位置,以及嵌套的数据类型的地址指向。
其中变量 a 和变量 b 保存的都是基本数据类型,foo 与 Foo 保存的都是引用数据类型,Foo 对象中还包含嵌套的数据类型。访问对象类型时,需要通过 obj.xxx 访问,即访问 Foo 内的 n 或 x 时,需要通过 Foo.n 或 Foo.n.x 访问,并且对象嵌套对象时,变量中不存在对 n 和 x 的直接引用,必须通过Foo.n 和 Foo.n.x 才能访问到嵌套的对象。
理解了上面的内容,那么对下面数据类型的赋值也会有一个清晰的认识。
// 基本数据类型的赋值
var a = 10;
var b = a;
b = 20; // a和b的值分别为多少?
console.log(a,b); // 10 20
// 引用数据类型的赋值
var foo = { c: 30 };
var Foo = foo;
Foo.c = 40; // foo内的c与Foo内的c的值分别为多少?
console.log(foo.c, Foo.c) // 40 40
在上面,我们知道了基本类型和引用类型在内存中的存放位置,那么我们这两个问题也会迎刃而解。
首先a是基本数据类型,存放在栈内存中,当把a的值赋给b时,即 b = 10,这时a和b在栈内存中保存的值相同,但这两个变量相互独立,改变b的值并不会影响a原本的值,因此a=10,b=20。
而foo属于引用数据类型,在栈内存中存放的是指向堆内存对象的地址值,赋值时把foo的地址值给了Foo,这时这两个变量指向同一个对象,改变Foo中c的值,foo中c的值也会改变。