📜  什么是接口并在 Typescript 的参考中解释它?

📅  最后修改于: 2022-05-13 01:56:27.980000             🧑  作者: Mango

什么是接口并在 Typescript 的参考中解释它?

TypeScript 是一种开源编程语言。它是 JavaScript 语言的超集。 Type-Script 专为大型应用程序的开发而设计。它由 Microsoft 开发和维护。 TypeScript 在语法上遵循 JavaScript,但添加了更多功能。它是 JavaScript 的超集。

接口:一般 接口是对象的结构或骨架。接口是对类强制执行语法的编程语法。它是对象的定义,只有它必须具有的数据类型。接口是对象的类型。

打字稿中的接口是对象的类型。在 Type-Script 中,接口是在 interface 关键字的帮助下定义的。 JavaScript 使用接口进行类型检查。该接口也称为结构子类型。

句法:

interface InterfaceName{
    PropertyName: Type;
    methodName() => Type;
} 

例子:

Javascript
// Interface for Array
interface ForList {
    [index:number]: string
}
let newArray: ForList = ["Interface", "for", "Array"];
console.log(newArray);


Javascript
// Interface for Function
interface ForFunc {
    (key:string,value?:string):void;
}
 
function Pri(key:string):void{
    console.log(key+" for "+value)
}
let newFunc: ForFunc = Pri;
newFunc("Interface","Function")
 
// Interface for Class
// Interface for Class
interface ForClass {
    readonly var1:string;              
}
interface ForList extends ForClass{
    var2:string;
    var3:string;
}
let newclass: ForList = {
    var1: "Interface",
    var2: "for",
    var3: "Array"
};
 
console.log(newclass);


输出:

[ 'Interface', 'for', 'Array' ]

在上面的Geek界面中,我们有score和articles两个属性,也就是说当我们使用该界面创建对象时,它必须包含这两个属性。 Typescript 中提供了许多接口的属性。让我们看看接口的一些属性。

扩展属性: Typescript 接口提供接口的扩展属性,可以重写现有接口的新属性。

interface For_Array {
    var1:  string;
}
interface For_List extends For_Array {
    var2: string;
}

这里的列表接口包含 var2 属性并扩展了 For_Array 属性的 var1 属性。

只读属性:这是接口的安全属性,使接口不可更改。我们可以在属性前使用 readonly 将任何属性设为只读。

interface For_class{
    readonly name: string;
    id: number;                          
}

在这里,由于我们将只读标记为名称,因此在将值分配给名称后,我们无法更改它的值。

可选属性:此属性使接口更有用,因为如果我们不清楚是否应该在任何对象的结构中添加属性。在这种情况下,我们可以使该属性成为可选的,因此它不仅仅是结构上的。我们可以使用 ?象征。

interface For_function {
    (key: string, value ?: string) : void ;
}

这里的 value 属性是可选的,所以当我们使用这个接口创建函数时,它可能包含也可能不包含 value 参数。

示例:接口通常是大数据类型和函数的类型。让我们在下面的代码中查看不同类型的接口。

Javascript

// Interface for Function
interface ForFunc {
    (key:string,value?:string):void;
}
 
function Pri(key:string):void{
    console.log(key+" for "+value)
}
let newFunc: ForFunc = Pri;
newFunc("Interface","Function")
 
// Interface for Class
// Interface for Class
interface ForClass {
    readonly var1:string;              
}
interface ForList extends ForClass{
    var2:string;
    var3:string;
}
let newclass: ForList = {
    var1: "Interface",
    var2: "for",
    var3: "Array"
};
 
console.log(newclass);

要编译 typescript 代码,我们可以在命令行上运行以下命令。

tsc Interface_Example.ts

此命令将生成一个名为 Interface_Example.js 的 JavaScript 文件

在命令行上使用以下命令运行 JavaScript 文件。

node Interface_Example.js

输出:

Interface for Function
{ var1: 'Interface', var2: 'for', var3: 'Array' }