在TypeScript中，let array = [1, 2, 3] as const 和 const array = [1, 2, 3] 的主要区别在于数组元素的可变性和类型推断的宽窄。

为了帮你快速把握核心区别，可以先看这个表格：

特性维度 let array = [1, 2, 3] as const const array = [1, 2, 3]
变量绑定 array 变量绑定可变更 (可重新赋值) array 变量绑定不可变 (不可重新赋值)
数组元素 元素不可变 (只读元组)，不能增删改 元素可变，可以增删改元素
推断类型 被推断为 readonly [1, 2, 3] (字面量只读元组，非常精确) 被推断为 number[] (通用数字数组，类型较宽泛)
适用场景 需要绝对恒定、结构固定的数据，如配置、枚举、函数返回值 变量引用不可变，但数组内容需要动态变化的情况

🔍 理解类型推断和可变性

  • 类型推断的差异：

    • 使用 as const 后，TypeScript 会将数组推断为一个只读的元组（readonly tuple），每个元素都会被视为它具体的字面量类型（如 1，2，3）。这被称为 const 上下文。
    • 仅使用 const 声明数组，TypeScript 通常会将数组类型推断为相对宽泛的元素类型数组，例如 number[]。

  • 可变性的区别：

    • as const 断言使得数组本身和其所有元素都变为只读（readonly），你不能对数组进行添加、删除或修改元素的操作。
    • 使用 const 声明的数组，其变量引用不可重新赋值，但你可以修改数组内部的内容，比如使用 push()、pop() 或直接通过索引修改元素。

💡 如何选择使用

  • 当你需要一个结构固定、内容绝对不允许修改的数组时，使用 as const。这常见于配置项、枚举值列表或需要精确类型推断的场景。
  • 当你需要确保变量引用不变，但数组内容可能需要动态变化时，使用 const 声明数组。

⚠️ 补充说明

需要注意的是，as const 断言会从编译后的 JavaScript 代码中完全删除，它仅在 TypeScript 的类型检查阶段起作用。这意味着使用或不使用 as const，应用程序在运行时的行为完全没有区别。