【TS】Interfaz

interfaz TS

Una interfaz es una declaración de una serie de métodos abstractos y una colección de características de métodos.
Estos métodos deben ser abstractos y necesitan ser implementados por clases específicas, para que clases específicas puedan ejecutar métodos específicos.

1. Ejemplo de interfaz simple

// 定义一个接口 User
interface User {
    
    
	name: string,
   	age: number,
    sing: ()=>string
}

//定义一个变量 xiaoXu
let xiaoXu: User = {
    
    
	name: "小徐",
	age: 18,
	sing: ():string => "徐前进"
}

console.log(xiaoXu.name); //小徐
console.log(xiaoXu.age); //18
console.log(xiaoXu.sing()); //徐前进

2. Tipos de unión e interfaces

interface RunOptions {
    
     
    program:string; 
    commandline:string[]|string|(()=>string); 
} 
 
// commandline 是字符串
var options:RunOptions = {
    
    
    program:"test1",
    commandline:"Hello"
}; 
console.log(options.commandline)  
 
// commandline 是字符串数组
options = {
    
    
    program:"test1",
    commandline:["Hello","World"]
}; 
console.log(options.commandline[0]); 
console.log(options.commandline[1]);  
 
// commandline 是一个函数表达式
options = {
    
    
    program:"test1",
    commandline:()=>{
    
    return "**Hello World**";}
}; 
 
var fn:any = options.commandline; 
console.log(fn());

3. Interfaces y arreglos

En la interfaz, el valor del índice y los elementos de la matriz se pueden establecer en diferentes tipos, y el valor del índice puede ser un número o una cadena.
Establezca el elemento en tipo de cadena:

interface namelist {
    
     
   [index:number]:string 
} 
var list1:namelist = ["Google","Runoob","Taobao"]; // 类型一致，正确
var list2:namelist = ["Runoob",1,"Taobao"]; // 错误元素 1 不是 string 类型

4. Herencia de interfaz

La herencia de interfaz significa que una interfaz puede extenderse a través de otras interfaces.

TS permite que las interfaces hereden de múltiples interfaces, usando palabras clave extends.

4.1 Herencia de interfaz única

interface Person {
    
     
   age:number 
} 
 
interface Musician extends Person {
    
     
   instrument:string 
} 
 
var drummer = <Musician>{
    
    }; 
drummer.age = 27 
drummer.instrument = "Drums" 
console.log("年龄:  "+drummer.age)
console.log("喜欢的乐器:  "+drummer.instrument)

4.2 Herencia de interfaz múltiple

interface IParent1 {
    
     
    v1:number 
} 
 
interface IParent2 {
    
     
    v2:number 
} 
 
interface Child extends IParent1, IParent2 {
    
     } 
var Iobj:Child = {
    
     v1:12, v2:23} 
console.log("value 1: "+Iobj.v1+" value 2: "+Iobj.v2)