js中值类型和引用类型的区别介绍

js中值类型和引用类型的区别介绍

在JavaScript中，变量分为值类型和引用类型。值类型主要包括基本类型数据，比如数字、字符串、布尔值等，引用类型主要包括对象、数组、函数等。两者在定义、赋值和传递参数等方面有着不同的表现。

值类型

定义

值类型的变量在定义的时候，会直接将数据储存在栈内存中。

let a = 1

赋值

当把一个值类型的变量复制到另一个变量上时，会直接将变量的值复制一份到新的内存地址中。

let a = 1
let b = a

此时，a 和 b 会各自储存一个值为 1 的数据，两者相互独立，互不影响。

传递参数

当把值类型的变量作为参数传递给函数时，会直接把变量的值传递给函数内部的参数，形参和实参互相独立。

function changeValue(num) {
  num = 2
}

let a = 1
changeValue(a)
console.log(a) // 输出1

引用类型

定义

引用类型的变量在定义的时候，会把数据保存在堆内存中，而变量名只是一个指针，指向保存数据的地址。

let obj = {}

赋值

当将一个引用类型的变量赋值到另一个变量上时，会将变量名的指针复制一份到新的内存地址中。

let obj = {}
let obj2 = obj

此时，obj 和 obj2 的指针都指向同一个堆内存中的数据，两者都可以对数据进行修改。

obj.a = 1
console.log(obj2.a) // 输出1

传递参数

当把引用类型的变量作为参数传递给函数时，实际上传递的是指针的副本，也就是说，形参和实参指向同一个堆内存中的数据。这时，修改形参会影响实参的值。

function changeValue(obj) {
  obj.a = 1
}

let obj = {}
changeValue(obj)
console.log(obj.a) // 输出1

总之，对于引用类型的变量，修改一个变量会引起其他指向同一份数据的变量发生改变，而值类型的变量则是独立互不影响的。

示例说明

示例1

let a = {name: 'Tom'}
let b = {name: 'Tom'}

console.log(a == b) // 输出 false
console.log(a === b) // 输出 false

因为a和b是两个不同的对象，在堆内存中分别分配了不同的地址，所以相等性比较结果为 false。

示例2

let a = [1, 2, 3]
let b = a
a.push(4)

console.log(b) // 输出 [1, 2, 3, 4]

因为a和b指向同一个数组对象，在堆内存中只分配了一个地址，所以对a的操作也会影响b。