如何在Typescript和Angular中声明静态常量教程

736 阅读2分钟

在这篇博文中,我们将介绍以下内容

  • typecript中的static关键字
  • angular中的常量
  • 如何在typescript和angular中定义公共静态常量
  • typecript和javascript中的static和const关键字的区别

typecript中的静态

像其他面向对象的编程一样,Typescript有对象和类

对象包含实例成员变量和函数,可以用对象访问。 类包含静态成员变量和函数,可以用类访问。

下面是一个类的静态变量和实例变量的例子

class User {
    static defaultRole: string = "employee";
    name: string;  
    constructor(name: string) {  
        this.name = name;  
    }  
    getName() {  
        return name;  
    }  
    
}

User.defaultRole; // returns employee

let myuser = new User("John");
myuser.name; // returns  John

在上面的类中,defaultRole是属于类的静态变量,name是属于类的实例,属于类的对象。

Angular和typescript中的const

在Angular组件中声明的公共常量成员变量

export class AppComponent {
public static const text:string;
constructor() {
   
  }
}

这段代码有用吗?

不,它不会起作用,而且会出现编译错误 ,类成员不能有'const'关键字

因为类成员是可变的,可以被不同的调用和对象修改和访问。

那么你如何用另一个字来代替const呢。

typescript,提供了readonly modifier 字段,而不是const。

这些只读元素可以被重新分配,不像const关键字那样。

export class AppComponent {
public  const text:string;
constructor() {
   
  }
}

如何在Angular和typescript中声明静态const?

因为const字段不能在类的实例变量中声明。

在一个类中,你可以为静态常量声明public static readonly。

class Employee {
    static readonly staticVariable = "staticdata";
    readonly instanceVariable = "instanceData";
}


一旦类被声明,你可以使用import导入:

import {Employee} from './Employee';
console.log(Employee.staticVariable);
console.log((new Employee).instanceVariable);

静态和常量在JavaScript和typescript中的区别

静态和常量都是在变量声明中使用的

静态变量和函数

  • 静态变量是一个类的变量,由一个类的所有对象共享。
  • 静态函数也被声明为只能访问静态变量
  • 它只能用类来访问
  • 静态类也可以被使用
  • 静态变量的值可以被改变

常量变量

  • const关键字用于定义常量变量。
  • 它被分配了固定的值,不能被改变。
  • 常量变量可以是普通类型、对象和数组。
  • 常量变量可以在不同的局部或块范围内被声明/重新分配
export const constants = {
   WEEK_NAMES: ["SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THURSDAY","FRIDAY","SATURDAY"],
   MONTH_NAMES: ["JAN","FEB","MAR"]
};