在接口定义中可以使用getter / setter方法吗?


92

目前,TypeScript不允许在接口中使用get / set方法(访问器)。例如:

interface I {
      get name():string;
}

class C implements I {
      get name():string {
          return null;
      } 
}

此外,TypeScript不允许在类方法中使用数组函数表达式:例如:

class C {
    private _name:string;

    get name():string => this._name;
}

我还有其他方法可以在接口定义上使用getter和setter吗?

Answers:


125

您可以在接口上指定属性,但是不能强制使用getter和setter,如下所示:

interface IExample {
    Name: string;
}

class Example implements IExample {
    private _name: string = "Bob";

    public get Name() {
        return this._name;
    }

    public set Name(value) {
        this._name = value;
    }
}

var example = new Example();
alert(example.Name);

在此示例中,该接口不会强制该类使用getter和setters,我可以改用属性(下面的示例)-但该接口还是应该隐藏这些实现细节,因为这是对调用代码的承诺关于它可以调用的内容。

interface IExample {
    Name: string;
}

class Example implements IExample {
    // this satisfies the interface just the same
    public Name: string = "Bob";
}

var example = new Example();
alert(example.Name);

最后,=>不允许使用类方法- 如果您认为Codeplex有燃烧的用例,则可以在Codeplex上开始讨论。这是一个例子:

class Test {
    // Yes
    getName = () => 'Steve';

    // No
    getName() => 'Steve';

    // No
    get name() => 'Steve';
}

1
您可以使用如下=>方法定义类方法:name = (a: string) => this._name;但是在输出JS中,它将在类函数内部定义,而不是扩展其原型对象。
orad

43

要补充其他答案,如果您希望get value在接口上定义a ,则可以使用readonly

interface Foo {
  readonly value: number;
}

let foo: Foo = { value: 10 };

foo.value = 20; //error

class Bar implements Foo {
  get value() {
    return 10;
  }
}

但是据我所知,正如其他人所提到的,当前尚无法在接口中定义仅设置属性。但是,您可以将限制移至运行时错误(仅在开发周期内有用):

interface Foo {
  /* Set Only! */
  value: number;
}

class Bar implements Foo {
  _value:number;
  set value(value: number) {
    this._value = value;
  }
  get value() {
    throw Error("Not Supported Exception");
  }
}

不推荐做法;但是一个选择。


2

首先,Typescript仅在以Ecmascript 5为目标时才支持getset语法。要实现此目的,您必须使用

tsc --target ES5

接口不支持getter和setter。为了使您的代码得以编译,您必须将其更改为

interface I { 
    getName():string;
}

class C implements I { 
    getName():string {
          return null;
    }   
}

打字稿所支持的是构造函数中字段的特殊语法。就您而言,

interface I {
    getName():string;
}

class C implements I {
    constructor(public name: string) {
    }
    getName():string {
        return name;
    }
}

注意class如何C不指定字段name。实际上是public name: string在构造函数中使用语法糖声明的。

正如Sohnee所指出的,该接口实际上应该隐藏任何实现细节。在我的示例中,我选择了需要Java样式的getter方法的接口。但是,您还可以设置一个属性,然后让类决定如何实现接口。


1
您可以在TypeScript中使用getset关键字。
Fenton

Object.definePropertyIE8 +,FF4 +,Opera 12 +,WebKit和Safari支持ECMAScript 5支持的旁注。github.com/kriskowal/es5-shim上
Fenton

-1

使用TypeScript 3.4:

interface IPart {
    getQuantity(): number;
}

class Part implements IPart {
    private quantity: number;
    constructor(quantity: number) {
        this.quantity = quantity;
    }
    public getQuantity = (): number => {
        return this.quantity;
    };
}

let part = new Part(42);

// When used in typescript, quantity is not accessible.
// However, when compiled to javascript it will log '42'.
console.log(part.quantity);

// Logs '42'.
console.log(part.getQuantity());

请参阅TypeScript Playground上的示例。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.