3.接口

接口是对值所语句的接口进行检查，被称做“鸭式辨型法”或“结构性子类型化。

举例说明接口是如何工作的

interface obj {
    name: string
    age: number
}
function teachers(params:obj) {
        console.log(params)
}
let teacher = teachers({name:'li',age:30})
obj --> 定义了一个对象，包含 name和age.
teachers -->定义一个函数，形参定义为obj --> {name: string,age: number}
当teachers执行时必须传入一个对象{name:'li',age:30} 这种格式得才能被编译器认可，否则报错
另外,类型检查器不会去检查属性的顺序，只要相应的属性存在并且类型也是对的就可以,
也就是说只要存在规定的属性(如上文的name，age)即可,在增加无用参数也可以,比如：
let teacher = teachers({name:'li',age:30,sex:''})也不会有错。

可选属性

接口中不必存在得属性可以用？来表示

interface obj {
    name？: string
    age: number
}
在属性名后添加？就表示他是一个可选属性，传入不传入都可以。

可选属性好处

• 对可能存在得属性进行预定义
• 捕获引用不存在的属性时得错误（以上面得obj为例，我传递的属性名为names，则报错）

  只读属性

  只读属性只能在初始化是赋值，而后在修改就会报错！

  interface obj {
   readonly name: string
   readonly age: number
  }
  let teacher:obj = {name:'1', age:5}
  teacher.age =60 //error

  只读数组ReadonlyArray，它与Array相似，只是把所有可变方法去掉了，因此可以确保数组创建后再也不能被修改.

  let a: number[] = [1, 2, 3, 4];
  let ro: ReadonlyArray<number> = a;
  ro[0] = 12; // error!
  ro.push(5); // error!
  ro.length = 100; // error!
  a = ro; // error!

  ReadonlyArray 保证了数组在初始化后任何属性不可变，也不能赋值给任何属性,如果想要重新赋值可以利用 断言重写如下所示：

  a = ro as number[]  //ok
  a = <number[]>ro //ok

  额外检查属性

  请看下面的例子：

  interface SquareConfig {
  color?: string; //可选
  width?: number;//可选
  }
  function createSquare(config: SquareConfig): { color: string; area: number } {
  return { color: '', area: 6 }
  }
  let mySquare = createSquare({ colour: "red", width: 100 ,area:''}); 
  //error “{ colour: string; width: number; area: string; }”的参数不能赋给类型“SquareConfig”的参数。
  对象文字只能指定已知的属性，但“colour”中不存在类型“SquareConfig”

  上面出现error原因:对象字面量会被特殊对待而且会经过额外的属性检查,当将他们赋值给变量或者作为参数传递的时候，出现对象字面量(SquareConfig)不包含的属性，就会报错。
  需要绕开这些检查，最简便的方法使用类型断言： ```typescript let mySquare = createSquare({ width: 100, opacity: 0.5 } as SquareConfig);

第二种检查方式,它就是将这个对象赋值给一个另一个变量,因为 `squareOptions`不会经过额外属性检查，所以编译器不会报错
```typescript
let squareOptions = { colour: "red", width: 100 };
let mySquare = createSquare(squareOptions);

其实并不应该绕开这些检查，大量额外的属性检查错误是真的bug

函数类型

例子：下面是描述函数类型的

//定义函数类型
interface SearchFunc {
  (source: string, subString: string): boolean;
}
创建函数类型变量，并使用
let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
  let result = source.search(subString);
  return result > -1;
}
对于函数类型检查,函数的参数名不需要与接口里定义的名字相匹配(值类型匹配即可)，可以修改如下
let mySearch: SearchFunc;
mySearch = function(src: string, sub: string): boolean {
  let result = src.search(sub);
  return result > -1;
}

可索引的类型

索引类型具有一个 索引签名，它描述了对象索引的类型，还有相应的索引返回值类型 如a[10]或者a[“name”]
下面阐述了什么是可索引类型：

interface StringArray {
  [index: number]: string;
} //上面是一个索引为 number类型，值为字符串类型的索引
let myArray: StringArray;
myArray = ["Bob", "Fred"];
let myStr: string = myArray[0];
这个索引签名表示当用number 去索引StringArray时会得到string类型的返回值

在TypeScript支持两种索引签名：字符串和数字索引，可以同时使用两种类型的索引，但是数字索引的返回值必须是字符串索引返回值类型的子类型， 这是因为当使用 number来索引时，JavaScript会将它转换成string然后再去索引对象。 也就是说用 100（一个number）去索引等同于使用”100”（一个string）去索引，因此两者需要保持一致。
下面例子说明了上面的观点

class Animal {
    name: string;
}
class Dog extends Animal {
    breed: string;
}
// 错误：使用数值型的字符串索引，有时会得到完全不同的Animal!
interface NotOkay {
    [x: number]: Animal;
    [x: string]: Dog;
} // 因为 NotOkay[0] == NotOkay['0']
//这个代表就表示数字索引的值类型必须是字符串索引的子类型，Object 时String的父类型
interface NumberDictionary {
  [index: string]: Object;
  [index: number]: string;
}

只读索引，防止给索引赋值

interface ReadonlyStringArray {
    readonly [index: number]: string;
}

类类型

实现接口，明确强制一个类去符合某种契约

声明类，并且implements 实现
interface ClockInterface {
    currentTime: Date;
    setTime(d: Date);
}
class Clock implements ClockInterface {
    currentTime: Date;
    setTime(d: Date) {
        this.currentTime = d;
    }
    constructor(h: number, m: number) { }
}

接口描述了类的公共部分，而不是公共和私有两部分。 它不会帮你检查类是否具有某些私有成员，我们应该直接操作类的静态部分

//声明静态类
interface ClockConstructor {
  new(hour: number, minute: number): ClockInterface;
}
//声明要实现的函数
interface ClockInterface {
  tick(): any;
}
// DigitalClock 实现这个接口 ClockInterface
class DigitalClock implements ClockInterface {
  constructor(h: number, m: number) { }
  tick() {
      console.log("beep beep");
  }
}
 //声明函数,返回 ClockInterface 类型
function createClock(ctor: ClockConstructor, hour: number, minute: number): ClockInterface {
  return  new ctor(hour, minute);
}
 let digital = createClock(DigitalClock, 12, 17);

继承接口

和类一样能够继承

interface Shape {
  color: string;
}
interface Square extends Shape {
  sideLength: number;
}
let square = <Square>{};
square.color = "blue";
square.sideLength = 10;
square.s = 10; //error 类型不存在则报错

可以继承多个接口

interface Shape {
  color: string;
}
interface PenStroke {
  penWidth: number;
}
interface Square extends Shape,PenStroke {
  sideLength: number;
}
let square:Square = <Square>{};
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;

混合类型

有时你会希望一个对象可以同时具有上面提到的多种类型。
下面的例子就是，一个对象可以同时做为函数和对象使用，并带有额外的属性

interface Counter {
    (start: number): string;
    interval: number;
    reset(): void;
}
function getCounter(): Counter {
    let counter = <Counter>function (start: number) { };
    counter.interval = 123;
    counter.reset = function () { };
    return counter;
}
let c = getCounter();
c(10);
c.reset();
c.interval = 5.0;

接口继承类

当接口继承了一个类类型时，他会继承类的成员，但不包含实现，就像接口声明了类成员但是没有提供实现具体一样，接口同样汇集成这个类的private和protected成员，这就意味着当你创建了一个接口继承了一个拥有私有或者收到保护的成员类时，这个接口类型只能呗这个类和其子类所实现

//定义一个类
class Control {
  private state: any;
}
 接口继承了这个类
interface SelectableControl extends Control {
  select(): void;
}
//Button 要 implements SelectableControl时必须要先继承 Control
才对，因为SelectableControl继承Contro时同时继承了私有变量state，这个类必须被这个类可子类所实现
class Button extends Control implements SelectableControl {
  select() { }
}
class TextBox extends Control {
  // select() { }
}
// // 错误：“Image”类型缺少“state”属性。
class Images  implements SelectableControl {
  select() { }
}

知识总结：

1.接口只会检查相应的属性存在并且类型也是对的就可以（额外的参数不会检查），并不会检查参数顺序
2.可选属性的好处：对可能存在得属性进行预定义，捕获引用不存在的属性时得错误
3.只读属性只能在创建时改变，随后值不可改变，如果想要改变可通过类型断言重写
4.额外的属性示例。当不确定参数时可使用 
interface SquareConfig {
    color?: string;
    width?: number;
    [propName: string]: any;
}
5.使用接口描述函数时，只需要保持参数名类型和返回值类型一致即可，参数名称可不对应。如果不标注，系统会自动类型推导。
    如下面的例子：
  interface SearchFunc {
    (source: string, subString: string): boolean;
  }
  let mySearch: SearchFunc = function(source: string, subString: string):boolean {
    let result = source.search(subString);
    return result > -1;
  }
  6.可索引签名分为两种，字符串和数字，两者可同时使用，但是数字索引的返回值必须是字符串索引返回值类型的子类型，因为当用number去索引时js会把他转化为string去索引，所以需要保持一致。利用只读索引可以防止给索引赋值。
7. 当用接口定义一个类时，可以用 implements 来实现，接口也可以继承，也可以继承多个，并且还具有混合类类型,(当时想一个对象既可以作为函数又可以作为对象使用时）,
8.接口继承类时同样会继承类的private和protected成员，当你创建了一个接口继承了一个拥有私有或者受保护的成员的类时，这个接口类型只能被这个类或者其子类所实现（implement）