TypeScript

抽象类abstract

抽象类做为其它派生类的基类使用。 它们一般不会直接被实例化。abstract 关键字是用于定义抽象类和在抽象类内部定义抽象方法。抽象类中的抽象方法不包含具体实现并且必须在派生类中实现

接口

TypeScript的核心原则之一是对值所具有的结构进行类型检查。TypeScript里，接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约

属性接口

interface 接口名称{
    必传属性:属性类型
}

可选属性

interface 接口名称{
    必传属性:属性类型
    可选属性?:属性类型
}

举例：封装ajax

interface args{
    type:string,
    url:string,
    data?:any,
    success?:any
}

function $ajax( args: args){
    let  xhr=new XMLHttpRequest()
    xhr.open(args.type,args.url)

    xhr.setRequestHeader("Content-type","application/json")
    xhr.send(JSON.stringify(args.data))

    xhr.onreadystatechange=function(){
        if(xhr.status==200 && xhr.readyState==4){
            console.log(JSON.parse(xhr.responseText));

            args.success(JSON.parse(xhr.responseText))
            
        }
    }
}

$ajax({
    type:"get",
    url:"./1.json",
    data:{
        a:1
    },
    success(res:any){
        console.log(res,"结果");
        // 渲染页面
        
    }
})

函数接口

接口除了描述带有属性的普通对象外，接口也可以描述函数类型。函数的参数会逐个进行检查，要求对应位置上的参数类型是兼容的

interface 接口名{
    (参数:类型,参数:类型):类型
}

类接口

强制一个类去符合某种契约

interface 接口名{
    属性:类型,
    方法(参数:类型)
}

implements

使生效; 贯彻; 执行; 实施

class 类名 implements 接口名{ 
    
}

类接口的延伸

interface a{
}
interface b extends a{
}

装饰器

装饰器其实就是一个函数，用来装饰类的

它是一种特殊类型的声明，它能够被附加到类的声明、方法、属性或参数上，也可以修改类的行为

若要启用实验性的装饰器特性，你必须在tsconfig.json里启用 experimentalDecorators 编译器选项

普通装饰器

//声明装饰器
function  装饰器的名字(params:type){
}

// 调用
@装饰器名称
class 类名{
}

工厂装饰器

// 声明

function 装饰器名称(params:string){
    //params 参数
    return (target:any)=>{
        // target 类
    }
}
// 调用
@装饰器名称(参数)
class 类名{
}

类的装饰器

修饰类的就叫做类装饰器

普通装饰器

//声明装饰器
function  装饰器的名字(params:type){
}
//调用装饰器
@装饰器的名字
class 类名{
    属性:type
}

工厂装饰器

可以传参

// 声明

function 装饰器名称(params:type){
    //params 参数
    return (target:type)=>{
        // target 类
    }
}
// 调用
@装饰器名称(参数)
class 类名{
     属性:type
}

属性装饰器

修饰属性

// 声明
function 装饰器名称(params:type){
    //params 参数
    return (target:type,prop:type)=>{
        // target 类
        // prop 属性
    }
}
// 调用
class 类名{
     @装饰器名称(参数)
     属性:type
}

方法装饰器

修饰方法

// 声明
function 装饰器名称(params:type){
    //params 参数
   
    return (target:type,methodName:type,methodInfo:type)=>{
        // target 类
        
        // methodName 方法
        
        // methodInfo 方法信息
    }
}
// 调用
class 类名{
   
     @装饰器名称(参数)
     methodName(){
         
     }
}

方法参数装饰器

修饰方法的参数

function zhuangshiqi(params:string){
    //params 参数

    return (target:any,methodName:any,paramsIndex:any)=>{
        // target 类
        // methodName 方法
        // paramsIndex 参数下标
    }
    
}
class xiaou{
    方法(@装饰器名称(参数)方法参数1:type , @装饰器名称(参数)方法参数2:type){
    }
}

装饰器的执行顺序

属性装饰器==》方法装饰器==》方法参数装饰器==》类的装饰器

多个装饰器 则先执行后面的

泛型

解决类、接口、方法的复用性

泛型函数

泛型函数，可以支持不特定的数据类型，要求传入的参数和返回的参数类型一致

function 函数名<T>(参数:T):T{
}

函数名<T>()

泛型类

class 类名<T>{
   
}

new 类名<type>()

泛型接口

interface  接口名{
    <T>(参数: T):T
}

let 函数名:接口名=function <T> (参数:T):T{

    return 参数
}

函数名<T>(value)