typescript如何定义对象类型呢?又是如何定义函数类型的呢?我们往下看,了解下interface接口以及implements用法以及interface的继承

1、那么我们今天首先了解Interface 接口
(1)首先他可以对对象的形状进行描述;
(2)它被称为鸭子类型(Duck Typing);

interface Person {
    name: string;
    age: number;
}
let viking: Person = { name: 'axin', age: 30 }
//多写少写,类型错误都会报错
//可以用?表示可选属性,即可写可不写
interface Nerson {
    name: string;
    age?: number;
}
let viking: Nerson = { name: 'axin' };
//不会报错因为age为可写属性,所以不会报错
interface Berson {
    readonly id:number;  //只读属性
    name: string;
    age: number;
}
viking.id=6666;
//这样会报错因为id为只读属性

function函数

let getLength = (input: string | number): number => {
    if (typeof input === 'string') {
        return input.length
    } else {
        return input.toString().length
    }
}
let add = getLength(1)

let getLength1: (input: string | number) => number = getLength;
//我们用这个声明函数类型:
getLength1: (input: string | number) => number

我们接下来用interface定义一个函数类型

interface Isum{
	(input: string | number):number
}
//然后以上这段input: string | number 联合类型
let getLength1: (input: string | number) => number = getLength;
//修改如下:
let getLength1:Isum = getLength;

typescript在没有定义类型的时候,我们赋值初始值后,会有类型推论,自动给你定义初始类型。

typescript中的类型断言

  function getLength1(input:string|number):number{
    const str = input as string;
    if(str.length){
       return str.length
    }else{
       const number = input as number;
       return number.toString().length;
     }

 }
//type guard
function getLength2(input:number|string):number{
   if(typeof input==='string'){
      return input.length 
   }else{
      return input.toString().length
   }
} 

在面向对象中一个类只能继承自另一个类,有时候不同的类之间可以有一些共同的特性,这时候我们使用子类继承父类的方法很难完成,这时候我们把这些特性提取成接口,然后用implements的关键字实现

interface Radio{
    turnRadio(trigger:boolean):void; 
}
interface Battery{
    checkBatteryStatus():void;
}
interface RadioWithBattery extends Radio{   //interface的继承
  checkBatteryStatus():void
}
class Car{
  turnRadio(trigger:boolean){
  }
}
class Cellphone{
  turnRadio(trigger:boolean){
  }
}
class Cellphone implements Radio,Battery{  //如果不想这样写接口也可以继承
//class Cellphone implements RadioWithBattery{   //这个写法也是可以的
   turnRadio(trigger:boolean){
  }
  checkBatteryStatus(){
  }
}
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值