TS基础知识记录（二）-全栈工程师需要了解的前端知识

ts中的接口

接口的作用：

• 在面向对象的编程中，接口是一种规范的定义，它定义了行为和动作的规范，在程序设计里面，接口起到一种限制和规范的作用。接口定义了某一批类所需要遵守的规范，接口不关心这些类的内部状态数据，也不关心这些类里方法的实现细节，它只规定这批类里必须提供某些方法，提供这些方法的类就可以满足实际需要。 typescrip中的接口类似于java，同时还增加了更灵活的接口类型，包括属性、函数、可索引和类等。
• 定义标准。

// 行为和动作的规范，对批量方法进行约束,就是传入对象的约束    属性接口
interface FullName{
    firstName:string;   // 注意;结束
    secondName:string;
}

function printName(name:FullName){
    // 必须传入对象  firstName  secondName
    console.log(name.firstName+'--'+name.secondName);
}
// printName('1213');  // 错误
var obj={   /*传入的参数必须包含 firstName  secondName*/
    age:20,
    firstName:'张',
    secondName:'三'
};
printName(obj)

// 接口的可选属性 
interface FullName{
    firstName:string;
    secondName:string;
}

function getName(name:FullName){
    console.log(name)
}

// 参数的顺序可以不一样
getName({        
    secondName:'secondName',
    firstName:'firstName'
})

interface FullName{
    firstName:string;
    secondName?:string;
}

function getName(name:FullName){
    console.log(name)
}  

getName({               
    firstName:'firstName'
})

函数类型接口:对方法传入的参数、返回值进行约束、批量约束

// 加密的函数类型接口
interface encrypt{
    (key:string,value:string):string;
}

var md5:encrypt=function(key:string,value:string):string{
    //模拟操作
    return key+value;
}

console.log(md5('name','zhangsan'));

var sha1:encrypt=function(key:string,value:string):string{
    // 模拟操作
    return key+'----'+value;
}

console.log(sha1('name','lisi'));

接口的继承

interface Animal{
    eat():void;
}

interface Person extends Animal{
    work():void;
}

class Programmer{
    public name:string;
    constructor(name:string){
        this.name=name;
    }
    coding(code:string){
        console.log(this.name+code)
    }
}

class Web extends Programmer implements Person{
    constructor(name:string){
        super(name)
    }
    eat(){
        console.log(this.name+'喜欢吃馒头')
    }
    work(){
        console.log(this.name+'写代码');
    }
}

var w=new Web('小李');
// w.eat();
w.coding('写ts代码');