各种类型的示例

let a:string='a'
let b:string[]=['a','b']
let c:[number,string]=[1,'b'] //元组
let d:any
let arr:Array<string>=['大家好','教师节快乐'];
interface NumberArray{
  [index:string]:number
}
function fn():void{
  alert(1)
}
let e =({a,b}:{a:number,b:number}):number=>{return a+b}
let hello = (name:string):string=>{`hello, ${name}`}
let map= new Map<number,string>();

interface（接口）

接口就是用代码描述一个对象必须有什么属性（包括方法），但是有没有其他属性就不管了。

比如「一个电脑有 USB 接口」的意思是这个电脑能够插入 USB 设备，这个电脑其他的功能就随意了。

interface Human{
  name: string,
  age: number
}

只读属性：

interface Human{
  readonly name: string,
  readonly age: number
}

最简单判断该用readonly还是const的方法是看要把它做为变量使用还是做为一个属性。

做为变量使用的话用 const，若做为属性则使用readonly。

可选属性：

interface Human{
  name?: string,
  age?: number
}

传 interface 规定之外的属性

interface SquareConfig {
  color?: string;
  width?: number;
}

function createSquare(config: SquareConfig): void {
  console.log(config)
}

let mySquare = createSquare({ color: "red", width: 100 });

想要传入 Interface 之外的属性，可以：

  • 使用类型断言
let mySquare = createSquare({ width: 100, opacity: 0.5 } as SquareConfig);
  • 使用索引签名
interface SquareConfig {
  color?: string;
  width?: number;
  [propName: string]: any;
}
  • 使用临时变量（不推荐）
let squareOptions = { colour: "red", width: 100 };
let mySquare = createSquare(squareOptions);

接口就是用代码描述一个对象必须有什么属性。

interface 属性是函数的情况

interface Human{
  name: string,
  age: number,
  add(a:number, b:number): number
}

interface 是函数的情况

interface SearchFunc {
  (source: string, subString: string): boolean;
}

interface 是函数，而且这个 interface 的属性也是函数的情况

interface 二则运算 {
  (a: number, b: number): number;
  逆运算(a: number, b: number): number;
}
let fn = (): 二则运算 => {
  let x: any = function(a: number, b: number): number {
    return a + b;
  };

  x.逆运算 = function(a: number, b: number): number {
    return a - b;
  };
  return x;
}

let add: 二则运算 = fn();
console.log(add(1, 2));

interface 是数组的情况

interface StringArray {
  [index: number]: string;
}

let myArray: StringArray;
myArray = ["Bob", "Fred"];

let myStr: string = myArray[0];

interface 可以继承

interface Shape {
  color: string;
}

interface Square extends Shape {
  sideLength: number;
}

let square = <Square>{};
square.color = "blue";
square.sideLength = 10;

interface 可以继承两个 interface（横向）

interface Shape {
  color: string;
}

interface PenStroke {
  penWidth: number;
}

interface Square extends Shape, PenStroke {
  sideLength: number;
}

let square = <Square> {};
square.color = 'red'
square.sideLength = 10;
square.penWidth = 10;

interface 可以继承继承过的 interface（纵向）

interface Shape {
  color: string;
}

interface PenStroke extends Shape {
  penWidth: number;
}

interface Square extends PenStroke {
  sideLength: number;
}

let square = <Square> {};
square.color = 'red'
square.sideLength = 10;
square.penWidth = 10;