在TypeScript中,不能使用const关键字来声明类属性。这样做会导致编译器报错“类成员不能有'const'关键字”。

我发现自己需要在代码中明确指出不应该更改某个属性。我希望IDE或编译器在声明属性后,如果我试图将新值赋给属性时出错。你们是怎么做到的?

我目前正在使用只读属性,但我想知道是否有更好的方法:

get MY_CONSTANT():number {return 10};

我使用的是typescript 1.8。建议吗?

PS:我现在使用的是typescript 2.0.3,所以我接受了David的答案


当前回答

你也可以简单地声明比如:src/classes/Car/consts/Honda.ts

export const CIVIC: string = "Civic";

export default {
    CIVIC: CIVIC
};

然后在类文件中执行如下操作:

import Honda from "./consts/Honda";

export class Car {

    protected model: string = Honda.Civic;

    [...]

}

export default Car;

这样,你就能确保它是一个常数。如果您正在构建数据集,这种方法也非常有用。

其他回答

Angular 2提供了一个非常好的特性,叫做Opaque Constants。 创建一个类并使用不透明常量定义其中的所有常量。

import { OpaqueToken } from "@angular/core";

export let APP_CONFIG = new OpaqueToken("my.config");

export interface MyAppConfig {
    apiEndpoint: string;
}

export const AppConfig: MyAppConfig = {    
    apiEndpoint: "http://localhost:8080/api/"    
};

将它注入到提供商中 app.module.ts

您将能够跨每个组件使用它。

Angular 4的编辑:

对于Angular 4,新概念是注入令牌&不透明令牌在Angular 4中已弃用。

注入令牌在不透明令牌的基础上增加了功能,它允许通过TypeScript泛型在令牌上附加类型信息,加上注入令牌,不需要添加@Inject

示例代码

使用不透明令牌

const API_URL = new OpaqueToken('apiUrl'); //no Type Check


providers: [
  {
    provide: DataService,
    useFactory: (http, apiUrl) => {
      // create data service
    },
    deps: [
      Http,
      new Inject(API_URL) //notice the new Inject
    ]
  }
]

Angular 4使用注入令牌

const API_URL = new InjectionToken<string>('apiUrl'); // generic defines return value of injector


providers: [
  {
    provide: DataService,
    useFactory: (http, apiUrl) => {
      // create data service
    },
    deps: [
      Http,
      API_URL // no `new Inject()` needed!
    ]
  }
]

注入令牌在逻辑上是在Opaque令牌之上设计的,而Opaque令牌在Angular 4中已弃用。

TypeScript 2.0有readonly修饰符:

class MyClass {
    readonly myReadOnlyProperty = 1;

    myMethod() {
        console.log(this.myReadOnlyProperty);
        this.myReadOnlyProperty = 5; // error, readonly
    }
}

new MyClass().myReadOnlyProperty = 5; // error, readonly

它不是一个确切的常数,因为它允许在构造函数中赋值,但这很可能不是一个大问题。

可选择的解决方案

另一种方法是使用static关键字和readonly:

class MyClass {
    static readonly myReadOnlyProperty = 1;

    constructor() {
        MyClass.myReadOnlyProperty = 5; // error, readonly
    }

    myMethod() {
        console.log(MyClass.myReadOnlyProperty);
        MyClass.myReadOnlyProperty = 5; // error, readonly
    }
}

MyClass.myReadOnlyProperty = 5; // error, readonly

这样做的好处是不能在构造函数中赋值,只存在于一个地方。

要么将readOnly修饰符与需要声明的常量一起使用,要么在类外声明一个常量,然后使用get操作符专门在所需的类中使用它。

对我来说,之前的答案都不管用。我确实需要将静态类转换为enum。 是这样的:

export enum MyConstants {
  MyFirstConstant = 'MyFirstConstant',
  MySecondConstant = 'MySecondConstant'
}

然后在我的组件中,我添加了其他答案中建议的新属性

export class MyComponent {
public MY_CONTANTS = MyConstans;
constructor() { }
}

然后在我的组件模板中,我这样使用它

<div [myDirective]="MY_CONTANTS.MyFirstConstant"> </div>

编辑:对不起。我的问题和OP的不同。如果别人有和我一样的问题,我还是会把它留在这里。

为此,您可以使用只读修饰符。只读的对象属性只能在对象初始化时赋值。

课堂上的例子:

class Circle {
  readonly radius: number;

  constructor(radius: number) {
    this.radius = radius;
  }

  get area() {
    return Math.PI * this.radius * 2;
  }
}

const circle = new Circle(12);
circle.radius = 12; // Cannot assign to 'radius' because it is a read-only property.

在对象字面量中的例子:

type Rectangle = {
  readonly height: number;
  readonly width: number;
};

const square: Rectangle = { height: 1, width: 2 };
square.height = 5 // Cannot assign to 'height' because it is a read-only property

同样值得知道的是,readonly修饰符纯粹是一个typescript结构,当TS被编译到JS时,该结构将不会出现在编译后的JS中。当我们修改属性是只读的TS编译器会警告我们(这是有效的JS)。