函數屬性的接口與「f（）」和「f：（）=>」有什麼區別？

Question

接下來考慮A和B接口：

interface A {f(): number} 
interface B {f:() => number} 

我試過接下來的事情就：

var a: A = {f: function() {return 1}} 
var a: A = {f:() => 1} 
var b: B = {f: function() {return 1}} 
var b: B = {f:() => 1} 

貌似相同。

Answer 1

它們是相同的。它們只是兩種不同的符號。你的接口說，必須有一個屬性f，這是一個沒有參數返回一個數字的函數。

{f: function() {return 1}}和{f:() => 1}是實現此接口的兩種方式。唯一的區別是第二個使用arrow function。這主要是合成糖，但使用this關鍵字略有不同。

Answer 2

此：

interface A { f(): number } 

是對聲明的方法的符號，而這個：

interface B { f:() => number } 

是怎麼來聲明函數類型的屬性。

雖然沒有真正的區別，當涉及到接口更有意義的一類：

class MyClass { 
    fn1() { 
     return 0; 
    } 

    fn2 =() => { 
     return 0; 
    } 

    fn3 = function() { 
     return 0; 
    } 
} 

編譯爲：

var MyClass = (function() { 
    function MyClass() { 
     this.fn2 = function() { 
      return 0; 
     }; 
     this.fn3 = function() { 
      return 0; 
     }; 
    } 
    MyClass.prototype.fn1 = function() { 
     return 0; 
    }; 
    return MyClass; 
}()); 

正如你所看到的只是fn1是連接到一個方法原型，而另外兩個只是屬性（在構造函數中賦值）。