返回

JavaScript 基本类型与引用类型全面梳理

前端

JavaScript 的变量类型大致可分为两类:基本类型和引用类型。它们在存储机制、赋值方式和值对比上存在显著差异。

基本类型

基本类型的值直接存储在栈内存中,存储变量的值本身 。赋值操作仅复制变量中的值,不会影响原始变量。包括:

  • 数值(number):整型、浮点型
  • 字符串(string):文本内容
  • 布尔值(boolean):truefalse
  • undefined:未赋值的变量
  • null:空值

引用类型

引用类型的值存储在堆内存中,存储指向该值的引用 。赋值操作仅复制指向堆中对象的引用,原始对象保持不变。包括:

  • 对象(object):存储键值对的集合
  • 数组(array):存储按索引访问的元素集合
  • 函数(function):代码块,可被调用
  • RegExp:正则表达式

比较差异

特征 基本类型 引用类型
存储位置
赋值方式 复制值 复制引用
值对比 比较值 比较引用
可变性 不可变 可变
传递方式 值传递 引用传递

举例说明

// 基本类型示例
let num1 = 10;
let num2 = num1;

num2++;

console.log(num1); // 输出:10
console.log(num2); // 输出:11

以上代码中,num1num2 都是基本类型。对 num2 的赋值和修改不会影响 num1 的值。

// 引用类型示例
let arr1 = [1, 2, 3];
let arr2 = arr1;

arr2.push(4);

console.log(arr1); // 输出:[1, 2, 3, 4]
console.log(arr2); // 输出:[1, 2, 3, 4]

以上代码中,arr1arr2 都是引用类型。对 arr2 的修改会同步影响 arr1 的内容。

注意要点

  • 虽然 null 被归为基本类型,但它实际上是一个指向 null 值的引用。
  • 函数是一种特殊类型的引用类型,它在执行时会创建一个新的作用域。
  • 引用类型的对象可以在堆中修改,但不能修改其引用。
  • JavaScript 中的所有对象都是引用类型,但它们可以包含基本类型的值。

掌握基本类型和引用类型的差异对于理解 JavaScript 中变量的赋值、比较和传递机制至关重要。深入了解这些类型之间的细微差别将有助于你编写更健壮和高效的代码。