TypeScript 接口的使用

声明对象类型

//通过类型（type）别名来声明对象类型
// type IInfoType = {name:string,age:number}

//另一种方式声明对象类型 接口：interface  推荐
//规范 定义接口前名称加I
interface IInfoType {
    readonly name: string, //定义只读属性
    age?: number //定义可选类型
    friend?:{
      name:string
    }
}
const infop: IInfoType = {
    name: "why",
    age: 12
}

索引类型

//通过interface定义索引类型
interface IndexLanguage {
    [index:number] : string
}

const frontLanguage : IndexLanguage={
 0:"HTML",
 1:"css",
}

函数类型

//type定义函数类型
type CalcFn = (n1:number,n2:number)=>number

// interface 定义 可调用的接口
interface CalcFn {
    (n1:number,n2:number) : number
}
const addNumber:CalcFn=(num1,num2)=>{
  return num1+num2
}

接口的继承

interface ISwim{
    swimming:()=>void
}
interface IFly{
    flying:()=>void
}
//多继承
interface IAction extends ISwim,IFly{
   
}
//接口的继承 里面有函数
const action:IAction={
    swimming(){},
    flying(){}
}

交叉类型

//一种组合类型的方式:联合类型
type whyType = number | string
type Direction  = "left" | "right" | "center"

//另一种组建类型的方式：交叉类型 &
type WType = number & string

interface ISwim{
    swimming:()=>void
}
interface IFly{
    flying:()=>void
}
type  MyType1 = ISwim & IFly //都要有才行
type  MyType2 = ISwim | IFly //有一个就行

const obj1:MyType1 = {
    swimming(){},
    flying(){}
}
const obj2:MyType2 = {
    swimming(){}, 
}

想要合并多个接口类型除了用继承的方法还可以用交叉类型继承只能实现单继承实现：实现接口类可以实现多个接口

interface和type都可以定义对象类型（官方建议用interface定义对象类型）常规定义非对象类型用type 比如联合类型函数类型定义对象类型 interface 可以重复定义相同名称的属性和方法结果会合并其中的属性和方法 type 定义别名不可以重复

字面量赋值

赋值的过程中有个擦除的操作会把地址擦除检测符合之后不报错

TypeScript 枚举类型

是为数不多的typescript的类型 script没有

//关键字 enum 内容一般是大写 本质上是给的数字 0 1 2 3
enum Direction1 {
    LEFT, //LEFT=100,可以修改值 下面会默认101开始
    RIGHT,
    TOP,
    BOTTOM
}

function turnDirection(direction:Direction1){

}

turnDirection(Direction1.LEFT) //传入枚举类型

泛型（重要）


//类型的参数化
//定义函数时 不决定这些参数的类型 让调用者以参数的形式告知 函数参数时什么类型
function sum<Type>(num1:Type):Type{
    return num1
}
//调用方式一：明确传入类型
sum<number>(20)
sum<{name:string}>({name:"ddd"})
sum<any[]>(['ddd'])

//调用方式二: 类型推导
sum(50)
sum("add")

function foo<T,E>(arg:T,arg2:E){

}
foo<number,string>(20,"ddd")

泛型接口的使用

interface IPerson <T1=string,T2=number>{
    name:T1
    age:T2
}
const p : IPerson = {
    name:"ddd",
    age:18
}

泛型类的使用

泛型的类型约束

extends 可以对类型进行约束

interface ILength{
    length:number
}

function  getLength<T extends ILength>(arg:T){
 return arg.length //必须有length属性
}
getLength("ddd")
getLength([22,33])
getLength({length:100})

模块化开发

命名空间nameSpace

export namespace time{
   export function format(time:string){

   }
}
namespace price{
    export function format(price:number){

    }
}

//要在其他模块使用的化 需要export导出
time.format

.ts文件是编写代码的文件最终会输出.js的文件 .d.ts文件用来做类型的声明仅仅用来做类型检测告知typeScript有哪些类型

内置类型声明

外部定义类型声明

可以针对链接寻找没有安装类型声明

内部定义类型声明

//在.d.ts里面声明lodash
//声明模块
declare module 'lodash'{
    export function join(){}
}
//声明变量/函数/类
declare let ddd = "ddd"

declare function Foo():void{
}

declare class Person{
  name:string
}

//声明文件
declare module "*.jpg"

declare module "*.vue"{

}
//声明命名空间
declare namespace $ {
export function ajax(setting:any):any  //使用$.ajax({})
}


//可以在其他模块使用
console.log(lodash.join());
console.log(ddd)
const p = new Person("ddd")

TypeScript语法(3)