JS:值类型和引用类型的深层理解

一.JavaScript中的变量类型有哪些？

（1）值类型（基本类型）：

• 字符串（string）、
• 数值（number）、
• 布尔值（boolean）、
• undefined、
• null

注：这5种基本数据类型是按值访问的，因为可以操作保存在变量中的实际的值）(ES6新增了一种基本数据类型：symbol http://es6.ruanyifeng.com/#docs/symbol )

（2）引用类型：

• 对象（Object）、
• 数组（Array）、
• 函数（Function）

二.值类型和引用类型的区别

（1）值类型：

• 1、占用空间固定，保存在栈中（当一个方法执行时，每个方法都会建立自己的内存栈，在这个方法内定义的变量将会逐个放入这块栈内存里，随着方法的执行结束，这个方法的内存栈也将自然销毁了。因此，所有在方法中定义的变量都是放在栈内存中的；栈中存储的是基础变量以及一些对象的引用变量，基础变量的值是存储在栈中，而引用变量存储在栈中的是指向堆中的数组或者对象的地址，这就是为何修改引用类型总会影响到其他指向这个地址的引用变量。）
• 2、保存与复制的是值本身
• 3、使用typeof检测数据的类型
• 4、基本类型数据是值类型

（2）引用类型：

• 1、占用空间不固定，保存在堆中（当我们在程序中创建一个对象时，这个对象将被保存到运行时数据区中，以便反复利用（因为对象的创建成本通常较大），这个运行时数据区就是堆内存。堆内存中的对象不会随方法的结束而销毁，即使方法结束后，这个对象还可能被另一个引用变量所引用（方法的参数传递时很常见），则这个对象依然不会被销毁，只有当一个对象没有任何引用变量引用它时，系统的垃圾回收机制才会在核实的时候回收它。）
• 2、保存与复制的是指向对象的一个指针
• 3、使用instanceof检测数据类型
• 4、使用new()方法构造出的对象是引用型

3. 示例：

// 值类型：Number、string、bollean、undefined
var a = 100
var b = a
a = 200
console.log(b) // 100 保存与复制的是值本身
 
// 引用类型：对象、数组、函数、null(空指针)
// 可以扩展属性
var a = {age:20}
var b = a
b.age = 21 
console.log(a.age) // 21 

// 利用typeof来区分
typeof undefined // undefined
typeof 'abc' // string
typeof 123 // number
typeof true // boolean

// typeof 区分不出来引用类型（除了函数）
typeof {} // object
typeof [] // object
typeof null // object
typeof console.log //function

// 用instanceof来区分引用类型
// 如果变量是给定引用类型（根据它的原型链来识别）的实例，那么instanceof 操作符就会返回 true。
console.log(person instanceof Object); // 变量 person 是 Object 吗？
console.log(colors instanceof Array); // 变量 colors 是 Array 吗？
console.log(pattern instanceof RegExp); // 变量 pattern 是 RegExp 吗？