TypeScript学习总结

Tpyescript类型

类型	描述
number	数字
string	字符串
boolean	布尔值 true或false
字面量	限制变量的值就是该字面量的值
any	任意类型
unknown	类型安全的any
void	没有值（或undefined）
never	不能是任何值
object	js对象
array	js数组
tuple	固定长度数组
enum	枚举

类型声明

//声明一个变量
let a:number = 1 //这是一个number类型的变量
let b = 1 //tpyescript会自动辨别类型，所以可以这样简写

//声明一个函数
function c(a:number , b:number //声明参数的类型
)：number //声明返回值的类型
{return a+b}

//声明一个箭头函数
let a:(z:number,c:number)=> number

//使用字面量进行变量声明
let a:10；//该变量声明后就不能更改成其它数字了
let a: 10 | 20 |30 //这样声明可以在三个数字中选择一个
let a:number | string //也可以用来链接多个类型

// &
let a:{name:string} & {age:number} //同时满足两个类型声明
a = {name:'小米',age:18}

//类型断言 as
语法： 变量名 as 类型  或  <类型>变量名
a = e as string //断言变量s是字符串类型
a = <string>e //效果一样

//对象类型声明
let a:{name: string}
a = {name:'小明'} //赋值时只能赋值string类型的name

//在属性后边加上？就变成可选属性了
let a:{name:string , age?:number}
a = {name:'小米'} //可以不写age

//当属性很多时用 [xxx:string]:类型 括号内是属性名的类型必定是string，外面是属性值的类型
let a:{name:string, [xxx:string]:number}
a = {name:'小米', a:1,b:2,c:3} //name属性必须写

//声明一个数组
语法： 类型[] 或 Array<类型>
let a:string[]  //字符串数组，里面只能有字符串
a = ['hi','hi','hi']

let a:Array<number> //数字数组
a = [1,2,3,4]

//元组，固定长度的数组的声明
let a:[string,number] //数组长度固定
a = ['hi' , 123]

//enum 枚举
enum Gender{Male,Female} //声明一个枚举类
let i:{name:string,gender:Gender} //使用枚举类声明对象
i = {name:'小米'，gender:Gender.Male}
if(i.gender === Gender.Male) return true

//类型别名 type
type mt = 1|2|3|4 //给类型起一个别名
let a:mt  //用类型的别名来代替
a = 1 

编译选项

首先创建一个tsconfig.json文件来进行配置

{
  // 一个*表示任意文件，两个*表示任意目录
'include':['./src/**/*','路径'],  //用来指定哪些ts文件需要被编译
'exclude':[],    //定哪些ts文件不需要被编译，优先级高于上面的include
               //默认值:['node_modules','bower_components','jspm_packages']
'extends':'路径',  //定义被继承的配置文件
'files':['sys.ts','tsc.ts','文件名'],  //指定被编译文件的列表，只有需要被编译的文件少时才会用到

'compilerOptions':{ //包含多个子选项，用来完成对编译的配置，是非常重要的配置选项
       'target':'ES3(默认)',  //设置ts代码编译后的目标版本
       
       'lib':[]  //用来指定项目中要用到的库，一般不需要设置
       
       'module':'es2015',  //指定要使用的模块化规范
       
       'outDir': './dist', //指定编译后文件所在目录
       
       'outFile':'./dist/src.js',  //将编译后的代码合并成一个文件
       
       'allowJs':false, //是否对js文件进行编译，默认是false
       
       'checkJs':false  //是否检查js代码符合规范，默认是false
       
       'removeComments':false //编译后是否移除注释，默认是false
       
       'noEmit':false //是否生成编译后的文件，默认是false
       
       'noEmitOnError':false //有错误时是否生成文件
      
       'strict'://true //所有严格检查的总开关
       
       'alwaysStrict':false //设置编译后文件是否使用严格模式，默认是false
       
       'noImplicitAny':false //是否允许隐式any类型，默认是false
       
       'noImplicitThis':false //是否允许不明确类型的this，默认是false
       
       'strictNullChecks':false //是否严格的检查空值，默认是false     
}
}

类

class Animal{ //定义一个动物类
    name:string  //声明类型
    age:number
    
    constructor(name:string,age:number){
        this.name = name
        this.age = age
    }
    
   bark(){
     console.log('动物在叫')
   } 
}

接口

//接口的功能和type类似

interface myInter{
   name:string
   sayHello():void //接口只定义对象的结构，而不考虑实际值  //接口中的所有属性都不能有实际值
}

interface myInter{
   age:number
}

//interface会合并
let a:myTinter = {
     name:'小米',
     age:18，
     sayHello(){}
}


interface my{
   name:string
   sayHello():void
}

class My implements my{ //定义类时，可以使类去实现一个接口，实现接口就是满足接口的要求
   name:string
   
   constructor(name:string){
      this.name = name
   }
   
   sayHello(){
     console.log('hi')
   }

}

泛型

//在定义函数或者类时，遇到类型不明确就可以使用泛型

function fn<T>(a: T ): T{ //指定单个泛型
   return a
}

fn(10)  //不指定类型，ts会自动推断
fn<string>('hi')  //指定类型


function fn<T，K>(a: T ,b:k): K{ //指定多个泛型
   return b
}

fn<number,string>(10,'hi')


interface Inter{
  length:number
}

//T extends Inter 表示泛型T必须是Inter实现类
function fn<T extends Inter>(a:T):number{
   return a.length
}

//类里面使用泛型
class My{
  name:T
  constructor(name:T){
    this.name = name
  }
}

const mc = new My<string>('小米')