typescript/angular中const和readonly的区别

在这篇文章中，你将逐步了解typescript和angular中const和readonly关键字之间的区别。
typescript中const和readonly变量的区别

const 只适用于变量
让我们声明一个常量-内容变量
const content;
Typescript编译器给出了**不能赋值给'content'，因为它是一个常量**错误 这意味着，常量必须在声明时被初始化，如下图所示
const content = "text string";
接下来，给常量赋值
// error
content = "new text";
编译器抛出一个错误不能赋值给'content'，因为它是一个常量。
这意味着，一旦常量变量被声明和初始化，值就不会被修改。
readonly适用于一个类的属性
在一个类中声明一个只读属性
class user {
    public readonly property;
在这里，这个属性被声明而没有被初始化，然而错误并没有被抛出，这只是一个有效的案例。
只读属性可以像常量一样被声明和赋值。
class user {
    public readonly property=11;
让我们创建一个类的对象并改变一个属性的值。
let myuser=new user();
myuser.property=12;
这将不会起作用，编译器会给出一个错误**不能分配给 "属性"，因为它是一个只读的**属性。
angular中的常量数组和只读数组的区别
这涵盖了typecript中常量数组和只读数组的比较。
让我们来声明和初始化const arrays
const constArray = [5,1,4];
const变量不能被重新分配，但是 const数组可以被修改/重新分配数组元素，没有任何问题。
constArray[1] = 3;   //works 
constArray.push(11); // works
constArray.pop(); //works
constArray.push(14); // works
console.log(constArray); //  [3, 1, 4, 14] 
但是，原始数组不能被重新赋值。
例如，数组变量被重新赋值为新的数组值，这时会出现一个错误不能赋值给'constArray'，因为它是一个常量。
让我们看看一个只读数组的例子
在下面的类中
用数字类型的ReadonlyArray声明了numbers属性并分配了一个数组的值
在方法中，试图使用pop/push和index来修改只读数组
class user {
numbers : ReadonlyArray = [10,11,12];
public modifyArray():void{
    this.numbers.pop();    //compiler error
this.numbers.push(15); //compiler error
this.numbers[0] = 1;   //compiler error
编译器给出了以下错误:
Property ‘pop’ does not exist on type ‘readonly number[]’. Property ‘push’ does not exist on type ‘readonly number[]’. Cannot find the name ‘numbers’. 你是指实例成员'this.numbers'吗？
这意味着，只读数组不能用push/pop/index方法重新分配。
但是我们可以用新的数据数组重新分配数组，如下所示
 this.numbers=[1,2,3];
总而言之，const和readonly可以用不同的方式进行修改
Const只适用于变量，readonly适用于属性
const值只在声明时被初始化，readonly可以在声明时不赋值。
const值不能被重新赋值，readonly可以被重新赋值。
由于angular使用typescript语言，同样的规则也适用于angular框架组件。