Typescript

Interface

接口相当于约束

例

function loadResult1 (res : {success:number , msg : string  }) { 
  // code block 
}
function loadResult2 (res : {success:number , msg : string  }) { 
  // code block 
}
function loadResult3 (res : {success:number , msg : string  }) { 
  // code block 
}

当我们多次定义这样的方法时,我们可以进行改造 , 将这个 res 参数固定成另外一种类型

例如 :

interface ResponseEntry {
    success: number,  
    msg : string 
}
function loadResult1(res:ResponseEntry) { }
function loadResult2(res:ResponseEntry) { }
function loadResult3(res:ResponseEntry) { }
// 可以进行统一管理, 并且方便

注意 , 使用这种接口时表示此对象必须拥有此接口的所有属性 , 当然也可以使用可选参数来表示这个参数可有可不有

interface ResponseEntry {
  success : number  ;  
  msg : string  ; 
  status ?: number  ;  // 表示这个对象中的status 这个属性可有,可没有 
}

只读属性

当这个对象只能在初始化时赋值的属性,并且不能更改, 我们就可以使用 readonly 来表示这个属性

interface ResponseEntry {
  readonly success : number ;  
  readonly msg : string ; 
  readonly status : number;  
}
ResponseEntry re = {
  success : 1 ,  
  msg : '当前请求成功' , 
  status : 1 
}
// ERROR 
re.msg = `当前请求失败` ;

索引签名 :

// 表示这个接口 可以拥有任意的属性  , 但是 color 和 width 的属性必须是对应的类型 
// 其他属性的类型任意 
interface SquareConfig {
    color?: string;
    width?: number;
    [propName: string]: any;
}

Function Types (用来规定一个函数)

// 规定这个函数 必须是以下格式 
/*
	function xxx (source : string , subString :string ) : boolean {
		// code block  
		return true | false ; 
	}
	
*/
interface SearchFunc {
    (source: string, subString: string): boolean;
}

Indexable Types 用来规定一个数组

interface StringArray {
    [index: number]: string;
}
let myArray: StringArray;
myArray = ["Bob", "Fred"];
let myStr: string = myArray[0];

TS 学习日记 - 02

Typescript

Interface