TypeScript 第五讲 ———— TypeScript 接口

前言:

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

1、属性类接口

2、函数类型接口

3、可索引接口

4、类类型接口

5、接口拓展

属性类接口

//ts中定义方法传入参数
function printLabel(label: string):void {

    console.log('printLabel');

}
printLabel('haha');

 

这里的  label: string 就是一种约束,虽然不是接口,但是表达了接口的定义,那就是一种规定的约束
//ts中定义方法传入参数
function printLabel(labelInfo:{label: string}):void {

    console.log('printLabel');

}
printLabel( label: ' 张三 ');//这里必须和传入的参数类型对应,这里传入的是对象
 
 

接口:行为和动作的规范,对批量方法进行约束

//传入对象的约束  属性接口
interface FullName{
    firstName: string;
    secondName: string;
}


function printName(name: FunllName){

    console.log(name.firstName+'....'+name.secondName)

}
var obj = {
   firstName: '';
   secondName: '';

};
printName(obj)   

函数类型接口

对方法传入的参数 以及返回值进行约束

interface encrypt{

   (key:string, value:string):string;

}
var md5:encrypt = function(key: number , value: string):string{

    return key+value;

}
console.log(md5('name', '张三'));

可索引接口

数组、对象的约束(不常用)

var arr: number[] = [12123,1243124]

var arr1:Array<string> = ['3342' , '324']

 

对数组:

interface UserArr{

  [index: number ]:string;

}
var arr:UserArr = ['aaaa', 'bbbb'];

console.log(arr[0]);

对对象的约束:

interface UserObj{

  [index: string]:string;

}
var arr:UserObj= { name: ' 张三 '};

类类型接口:

对类的约束 和 抽象类有点相似

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();

 接口的拓展:

接口可以继承接口

interface Animal{

   eat():void;

}
interface Person extends Animal{

   work():void;

}
class Web implements Person{
  
   public name:string;
   constructor(name:string){
     
      this.name = name;

   }
   eat(){
       console.log(this.name+'喜欢吃馒头');
   }
   work(){
       console.log(this.name+'写代码');
   }
  

}

var w = new Web('小李');
w.work();

复杂类型:

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)
    }

}
//web类
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.work(); w.coding('写ts代码');

 

转载于:https://www.cnblogs.com/mqflive81/p/11489195.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值