全面了解 js ES11 语法规范内的“常量和常量类型（const 和 readonly）”
在 JavaScript 中，常量是指不可变的值，在声明的时候就必须被赋予一个值，赋值之后就不能再被修改。常量在 ES6 标准的时候被引入，使用 const 关键字声明。
而 readonly 是 TypeScript 在 ES11 标准中新增的关键字，它与 const 很相似，唯一的区别在于 readonly 可以用来声明在运行时才能被确定的值。这则允许变量不仅被声明为可读的，同时在运行时被指定一次，这更符合一些场景下的使用需求。
这里将我们来全面了解 JavaScript ES11 语法规范内的“常量和常量类型（const 和 readonly）”，让你深入了解这个强大而又灵活的特性。
const 常量
使用关键字 const 声明的变量必须在声明时初始化，且一旦初始化后，便不能再修改。const 常量的作用域与 let 关键字相同，只在声明的块级作用域内有效。
常量的申明如下：
----- -- - -----
当我们试图修改变量 PI 的值时，控制台会提示出错。
-- - ----- -- -------- ---------- ---------- -- -------- ---------
上述代码抛出了一个类型错误，因为我们不能重新分配常量 PI。
当使用 const 关键字声明引用类型时，可以修改其属性，但不能重新分配一个新的对象或数组给它。
----- --- - --- -- --- ------------ -- ----- --- - --- -- -- --- -- ------ ---------- -- -------- ---------
常量使用的注意事项：
- 常量赋值后值不可更改。
- 常量拥有块级作用域，与 let 关键字相同。
- 常量对于声明的变量类型，可以是基本类型、对象、数组等。
readonly 常量
ES11 中，readonly 关键字用来限制一个类的实例的成员变量只能被读取，在 TypeScript 中，readonly 成员变量必须在声明时或者在其构造函数中初始化。
在 JavaScript 中，readonly 也可以用来修饰对象的属性，然而在对象属性中只是被标记为不可写，而不是不可修改，因为可以使用 Object.defineProperty()、Object.defineProperties() 和 Object.freeze() 将其设置为只读。
下面是一个 TypeScript 中使用 readonly 的例子：
----- -------- -
-------- ----- ------- -- -----
-------- ------ -------
----------------- ------- ------ ------- -
--------- - -----
---------- - ------
-
-
--- ---- - --- ---------------- ---------
----------------------- -- ----
--------- - -------- -- ------ ------ ------ -- ------ ------- -- -- - --------- ---------当编译上述代码时，TypeScript 编译器会将类成员变量与存储的初始值转换成直接在属性访问器本身上，任何尝试写入 readonly 成员变量的代码都会得到编译期错误。
另一个 readonly 的使用场景是在函数参数中，通常用来描述参数或者函数返回值的形式。
-------- --------------------- -------- --------- -
---------- - ---- -- ------ -----------
-
---------------- -- ----将数组类型参数设置为 readonly 之后，数组中的元素将不能被修改。
常量使用的注意事项：
- readonly 是 TypeScript 中新增的关键字，用来限制类的实例和对象的属性只能被读取，不能被修改。
- readonly 成员变量必须在初始化语句或者构造函数中初始化。
- 使用 readonly 修饰的数组等集合类型，内部元素也为只读。
总结
在 ES11 版本中，新增了 readonly 关键字，使得 JS 中的常量定义更加灵活，可以更加适应不同场景的使用需求。const 和 readonly 都是用来修饰被声明为常量的变量，但是它们在使用上，还是有些细微的差异，需要根据场景进行灵活选择。在实际应用时，根据代码的特点和业务逻辑的要求来合理地应用常量的定义，可以提高代码的可读性和维护性，降低代码的出错率。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64b253b048841e9894e951c3