TypeScript interfaces和classes的區別用法及代碼示例

在本文中，我們將了解 TypeScript 中的 “interface” 和 “Classes” 之間的區別。

接口：接口是用於type-checking的虛擬結構。在TypeScript我們使用接口關鍵詞創建具有身份的新接口。它為相同的數據類型創建結構。接口是用名稱和類型定義對象的屬性和方法的結構。

用法:

interface New_Interface{ // This is interface Body }

特征：

它具有鬆耦合。
它支持多重繼承。

示例 1：

Javascript


// Interface for Class
interface ForClass {
    readonly var1:string;               
}
let newclass: ForList = {var1:"Interface"};
console.log(newclass);

輸出：

{ var1: 'Interface' }

示例 2：

Javascript


// Interface for Object with extends function 
interface ForObj {
    First: string
}
interface forNewObj extends ForObj {
    Second: number
}
let newArray: forNewObj = {
    First: "Interface for Object",
    Second: 2
};
console.log(newArray);

輸出：

{ First: 'Interface for Object', Second: 2 }

Classes: 它們是對象的骨架，我們用它來實現對象。在 TypeScript 中，我們使用 class 關鍵字來創建對象的構造函數。它可以有屬性、方法和變量。

用法:

class geeks {
    // Class property and methods
    // are created here
}

特征：

在類中，它支持成員可見性。
它支持成員重寫。
它支持繼承。

示例 1：

Javascript


const Table_Object = {
                     
    // field of class
    Size : 32,
                  
    // Collection field 
    contents : ["Book","Pen"],
                  
    // Function 
    print : function() {
        console.log("hello Geeks")
    }
}
  
console.log(Table_Object);

輸出：

{ 
    Size: 32, 
    contents: [ 'Book', 'Pen' ], 
    print: [Function: print] 
}

示例 2：

Javascript


class Geeks {      
    name : string ;
    articles: number ; 
    cp_problems: number;
    // Constructor of class
    constructor(name:string, articles: number, cp_problems: number) {
        this.name = name;
        this.articles = articles;
        this.cp_problems = cp_problems;
    }
                  
    // About object 
    About() : void {
        console.log("Name of Geeks: " + this.name );
        console.log("No. of articles by Geeks: "
            + this.articles);
        console.log("No. of cp problems sol by Geeks: "
            + this.cp_problems)
    }
}
var geek1 = new Geeks("Abhinav", 87, 560);
geek1.About();

輸出：

Name of Geeks: Abhinav
No. of articles by Geeks: 87
No. of cp problems sol by Geeks: 560

接口和類的區別如下：

Interface	Classes
我們可以使用interface關鍵字創建接口。即接口 Interface_Name{ \\ Interface Body }	我們可以使用 class 關鍵字創建類。即類 Class_Name{ \\ 類主體 }
接口藍圖主要是對象的Type結構。即它是僅定義內部參數類型的對象。	類是對象的藍圖，即創建目的類是我們實現代碼對象的方式。
它用於類型檢查目的。 TypeScript語言接口的使用主要是檢查對象中參數的類型。	類型腳本中的類用於為某些東西創建對象。它用於實現對象。
我們無法在打字稿中使用 new 創建接口實例。這意味著我們無法在 Typescript 中創建實例的副本。	我們可以在 TypeScript 中創建該類的新實例。這意味著我們可以使用 new 關鍵字創建類的副本。
接口是虛擬結構。意味著它僅出現在 TypeScript 代碼中，而不出現在 TypeScript 編譯的 JavaScript 代碼中。	它始終存在於將 TypeScript 編譯為 JavaScript 後的代碼中。

相關用法

注：本文由純淨天空篩選整理自satyam00so大神的英文原創作品 Difference between interfaces and classes in TypeScript。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。