爲什麼一個對象接口定義類似於類接口定義打字稿

Question

我非常新的打字稿，當我學會它從它與接口部分操場，有一個迷惑：

http://www.typescriptlang.org/Handbook#interfaces-our-first-interface-

http://www.typescriptlang.org/Handbook#interfaces-class-types

一個是談論如何定義對象的接口，一個是定義類，但他們可以使用類似的結構，任何人都可以指出爲什麼？

Answer 1

在這兩種情況下，接口都有相同的用途 - 應用類型限制/優化。 「對象接口」和「接口（或應用於）類」之間沒有區別。

第一個例子顯示Structural Typing而不引入一類的概念：

任何類型具有型貼合結構滿足合同接口。

..注意我們沒有必要明確地說我們傳遞給'printLabel'的[匿名創建的]對象實現了這個接口，就像我們在其他語言中可能需要的一樣。在這裏，這只是重要的形狀。 如果我們傳遞給函數的對象[可以靜態證明符合] [在接口]中列出的要求，那麼它允許。

隱含保證此合同實現一個接口的類的一個實例。將接口添加到類允許對類聲明本身進行額外的約束檢查，而不是僅在使用站點處進行：這可以實現更多本地化和有用的與類型相關的錯誤報告。

---

這是一個靜態/彙編限制：已被自動地從對象文本本身合成的對象的類型信息。實際的運行時間值與證明類型正確性無關。

Answer 2

對象的接口，一個是定義類，但可以用類似的結構，任何人都可以指出爲什麼

的object有創造者沒有運行知識。而類實例知道它的構造函數。請看下面：

interface Foo { 
    foo: number 
} 

let foo: Foo = { foo: 123 }; 

class Bar { 
    bar: number; 
} 

let bar: Bar = new Bar(); 
bar.bar = 123; 
console.log(bar instanceof Bar); // True 

這並不改變的事實，打字稿是結構性https://basarat.gitbooks.io/typescript/content/docs/getting-started.html

而且類可以給你的代碼提供了更大的結構：https://basarat.gitbooks.io/typescript/content/docs/classes.html

Answer 3

它們有相似的結構，但它們是以不同的方式使用。該類允許您創建要在應用程序中使用的新對象。接口告訴編譯器應該如何構造結構。在下面你可以看到你可以爲標籤屬性添加一個值。你不能通過界面來做到這一點。

interface Something { 
    label: string; 
} 

class Something { 
    label: string = 'some string value'; 
} 

在接口下面的例子中強制執行Something類總是需要一個名爲label屬性和類型必須是一個string。如果您更改類型或一起移除屬性。編譯器會抱怨。

interface ISomething { 
    label: string; 
} 

class Something implements ISomething { 
    label: string = 'some string value'; 
} 

在上面，我建議使用您的接口名稱前添加一個資本I消除類和接口之間的混亂約定的例子。

---

在下面的例子中，我們將使用一個接口（IUser）允許serveral的類被傳遞到getUserDescription功能，無需編譯器抱怨。這稱爲多態性。我們的功能不在乎是否是老師，學生或任何其他課程。它所關心的只是傳入的結構與接口匹配。

interface IUser { 
    firstName: string; 
    lastName: string; 
    type: string; 
} 

class Student { 

    firstName: string = null; 
    lastName: string = null; 
    type: string = 'student'; 
    courses: Array<any> = []; 

    constructor(firstName: string, lastName: string) { 
     this.firstName = firstName; 
     this.lastName = lastName; 
    } 
} 

class Teacher implements IUser { 

    firstName: string = null; 
    lastName: string = null; 
    type: string = 'teacher'; 
    classes: Array<any> = []; 

    constructor(firstName: string, lastName: string) { 
     this.firstName = firstName; 
     this.lastName = lastName; 
    } 
} 

const getUserDescription = (user: IUser): string => { 
    return `${user.firstName} ${user.lastName} is a ${user.type}`; 
}; 

getUserDescription(new Teacher('Harry', 'Jones')); // Harry Jones is a teacher 
getUserDescription(new Student('Joe', 'Cool')); // Joe Cool is a student 

如果您發現上面Teacher實現IUser但Student沒有。你通常都會以同樣的方式完成，但我想表明你可以在課堂上強制執行結構。

查看我的文章http://www.codebelt.com/typescript/typescript-classes-object-oriented-programming/瞭解更多信息。