typescript之四(接口)

      通常接口,我们通过interface关键字来定义接口,例如:

typescript之四(接口)
typescript之四(接口)

       接口,我们在后端语言来说经常会用到,其作用也是主要用来约束,typescript中接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约

       接口里的属性不全都是必需的。 有些是只在某些条件下存在,或者根本不存在。带有可选属性的接口与普通的接口定义差不多,只是在可选属性名字定义的后面加一个?符号

一旦我们给定的参数不符合接口类型定义的,则编辑器会报出相应的错误

typescript之四(接口)

可选属性又有些什么好处呢?

可选属性的好处之一是可以对可能存在的属性进行预定义,好处之二是可以捕获引用了不存在的属性时的错误

typescript之四(接口)

在使用它的时候,编辑器会把该接口下的所有属性都罗列出来。

TypeScript具有ReadonlyArray<T>类型,它与Array<T>相似,只是把所有可变方法去掉了,因此可以确保数组创建后再也不能被修改

typescript之四(接口)
typescript之四(接口)

 但可以通过断言来转化number = ro as number[]

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

我们在使用接口来做为参数时,作为属性检查是,最佳的方式是能够添加一个字符串索引签名

typescript之四(接口)

如果让这个函数返回数字或字符串,类型检查器会警告我们函数的返回值类型与SearchFunc接口中的定义不匹配

// 接口中定义的一个函数

interface SearFun{

    (source:string,subString:string):boolean;

}

// 使用接口函数,我们不需要将参数名相同,接口中的函数中的参数个数及参数类型,下面在实现接口使用该函数的时候函数参数个数及类型会优先匹配接口中函数参数

let resFun:SearFun = (src: string, sus: string) => {

    let result = src.search(sus);/*  */

    return result > -1;

}

 可索引类型具有一个 索引签名,它描述了对象索引的类型,还有相应的索引返回值类型。

类类型接口: 对类的约束  和   抽象类抽象有点相似

interface Animal {

    name: string;

    eat(str: string): void;

}

class Dog implements Animal {

    name: string;

    constructor(name: string) {

        this.name = name;

    }

    eat() {

        console.log(this.name + '吃粮食')

    }

}

var d = new Dog('小黑');

d.eat();

class Cat implements Animal {

    name: string;

    constructor(name: string) {

        this.name = name;

    }

    eat(food: string) {

        console.log(this.name + '吃' + food);

    }

}

var c = new Cat('小花');

c.eat('老鼠');

// 在使用可索引类型时

interface StringArray {

    // 其中index是随意写的

    [index: number]: string;

}

let myArray: StringArray;

myArray = ['lucy', 'jack'];

// number是索引的类型,比如myArray[0],上述的number就是此处的0,返回的结果“lucy”的类型时上面的string类型

console.log(myArray[0]);

interface UserObj {

    // 当前能使用的索引类型及返回值

    [index: string]: string;

    [index: number]: string;

}

// 对象接口也是一致

var arr: UserObj = { name: '张三', age: "32", 1: '43' };

console.log(arr['name']);//'张三'

console.log(arr[1]);//43

// 使用类来作为可索引接口的返回值时

class Animal {

    age: number;

    color: string;

}

// 继承Animal

class Dog extends Animal {

    size: number;

}

interface NotOkay {

    [x: number]: Animal;

    [x: string]: Animal;

}

let aanimal = new Animal();

aanimal.age = 23;

aanimal.color = 'red';

let xx: NotOkay = { 'a': aanimal, 12: aanimal };

console.log(xx[12].age === xx['a'].age);  // true

类实现接口

// 实现一个接口

interface Idate{

    curTime:Date;

    getTime();

}

// 在实现Idate接口后,务必拥有curTime属性并且是Date类型,若接口中拥有方法,则也需要实现该方法

class Ctime implements Idate{

    curTime:Date;

    getTime(){}

}

 继承接口

和类一样,接口也可以相互继承。 这让我们能够从一个接口里复制成员到另一个接口里,可以更灵活地将接口分割到可重用的模块里

interface Counter {

    // 定义一个调用签名函数,返回值为string类型

    (start: number): string;

    // number属性

    interval: number;

    // 一个返回值为空的函数reset

    reset(): void;

}

function getCounter(): Counter {

    // 该方法返回一个字符串;

    let counter = <Counter>function (start: number) { start += 2; return start + ''; };

    counter.interval = 123;

    counter.reset = function () { };

    return counter;

}

let cc = getCounter();

console.log(cc(10));//12 字符串类型

cc.reset();

cc.interval = 5.0;

接口继承类

当接口继承了一个类类型时,它会继承类的成员但不包括其实现。 就好像接口声明了所有类中存在的成员,但并没有提供具体实现一样。 接口同样会继承到类的private和protected成员。 这意味着当你创建了一个接口继承了一个拥有私有或受保护的成员的类时,这个接口类型只能被这个类或其子类所实现(implement)。当你有一个庞大的继承结构时这很有用,但要指出的是你的代码只在子类拥有特定属性时起作用。 这个子类除了继承至基类外与基类没有任何关系

class A{

    public name:string;

}

interface IA extends A{

    select():void;

    age:number;

}

class B extends A implements IA{

    select(){};

    age:2;

}

class C implements IA{

    select(){};

    age:32;

    name:'jack'

}

百度未收录
分享