Directory基本类型语法PrimitiveTypeStringNumberBooleanNullUndefinedSymbolVoidNeveranyTypeObjectTypeArrayTypeTupleTypeTuple使用场景拿TypeScript学map基本类型语法primitivetypestringconsta:string='foobar'numberconstb:number=100//NaN,Infinitybooleanconstc:boolean=true//falseNullconste:null=null非严格模式string,number,boolean,void允许为空和null，butnotinstrictmode//在严格模式下，会报错constd:string=null如何关闭严格模式？在配置文件中找到strict{"compilerOptions":{//true启用严格模式，false是禁用严格模式"strict":false,}}Undefinedconstf:undefined=undefinedSymbol是一个原始类型，但是这个类型是由ES6，而默认配置是ES3，所以会报错。如果target改成es5，Symbol也会报错，怎么办？TypeScript(一)——类型标准库有详细说明consth:symbol=Symbol()Void，表示没有类型。constd:void=undefined是最长的当一个函数没有返回值的时候，你通常会看到它的返回值类型是void。functionFuc():void{console.log('helloworld')}Never至今没用过。根据文档说明，函数抛出异常时会用到，这里不做解释。anytypeany是任意类型，而且还是动态类型。它与普通的JavaScript变量相同。它可以存储任何类型的值，也可以在运行过程中更改为任何类型的值。不会有语法错误，因为它是任何类型的值，因此TypeScript不会对其进行类型检查。letfoo:any='string'foo=100foo.bar()//当前值可以是任何类型的值functionstringify(value:any){returnJSON.stringify(value)}stringify('string')stringify(100)stringify(true)而any因为不进行类型检查，所以还是存在类型安全问题，所以不要轻易使用，它的存在主要是为了兼容旧代码。对象类型对象类型是一种非原始类型，不仅仅指对象类型，还包括对象、数组和函数类型。//使用原始类型会报错//这里object不仅仅接收对象，还包括函数、数组和对象constfoo:object=function(){}//object{}//array[]简单需要为对象类型定义Literal形式，限制是分配的对象结构必须与定义完全一致，不能多也不能少。constobj:{foo:number,bar:string}={foo:123,bar:'string'}如果想在TypeScript中限制对象类型，更专业的方法是使用接口，我们接下来会讲到接口时间。数组类型//一般声明constarr1:Array=[1,2,3]//简短声明constarr2:number[]=[1,2,3]例如：传入数字的参数，和finallyReturnnumberssum//所以这里需要判断我们这里是不是number类型，并添加一个数组类型注解functionsum(...args:number[]){//reduce的第一个参数是最后一个回调的结果第二个第一个参数是当前值（初始值为0），最后返回两者之和returnargs.reduce((prev,current)=>prev+current,0)}console。log(sum(1,2,3,4,5))//15console.log(sum(1,2,'3',4,5))//错误！元组类型元组是指定元素数量和每个元素类型的数组。元组类型可以声明为数组文字。//下面如果类型和数量不一致就会报错consttuple:[number,string]=[1,'string']//如果要访问元组的元素，还是可以使用下标toaccessconstage=tuple[0]constname=tuple[1]//也可以使用数组解构访问const[age,name]=tuple的使用场景tuplereturnsmultiplereturnvaluesinthefunctionReactuseState()Hook返回一个元组类型Object.entries()获取对象中所有的键值数组，每个键值是一个元组枚举类型开发过程中经常会涉及到需要用某些值来表示某些状态。这种数据结构在其他语言中很常见，但是JS中没有这种数据结构，一般都是用对象来模拟的。constPostStatus={Draft:0,Unpublished:1,Published:2}constpage={title:'typeScriptGuidelines',content:'content',status:PostStatus.Draft}特性既然TypeScript有枚举类型，它的特性就是：给一组值一个语义更好的名字。一组数据只有几个固定值，不存在超出范围的可能。DEMO例如：下面是出版书籍的三种状态：Draft是Draft状态：0Unpublished是未出版：1Published是出版：2//enum是枚举类型，后面是枚举名称，用等号代替colonenumPostStatus{Draft=0,Unpublished=1,Published=2}//使用时，使用对象的方法。constpost={title:'typeScriptguide',content:'content',status:PostStatus.Published//1//0}如果不加=，则值默认从0开始累加enumPostStatus1{Draft,//0Unpublished,//1Published//2}如果给了第一个值，那么后面的所有成员都会在此基础上累加enumPostStatus2{Draft=6,//6Unpublished,//7Published//8}枚举的值也可以是字符串，字符串不能自增，每个都需要赋值enumPostStatusStr{Draft='string1',Unpublished='string2',Published='string3'}枚举类型会侵入代码枚举类型会在运行时侵入代码。简单来说就是会影响编译结果。TypeScript的大部分类型最终都会被编译和移除，只是为了开发随时可以进行类型检查，枚举会被编译成一个双向键值对对象，通过值可以找到键，并且可以通过键找到值。下面的代码会在项目中保留varPostStatus;(function(PostStatus){//可以看到下面的代码，内层使用枚举键存储枚举值，外层使用枚举值存储作为键，保存枚举键PostStatus[PostStatus["Draft"]=0]="Draft";PostStatus[PostStatus["Unpublished"]=1]="Unpublished";PostStatus[PostStatus["Published"]=2]="已发布";})(PostStatus||(PostStatus={}));这样做的目的是根据枚举值动态获取枚举的名称PostStatus[0]//Draftifwedon't上面的语句是用来访问key的，所以推荐使用常量枚举。常量枚举就是在enum前面加上const，这样代码就不会被侵入。上面的双向键值对的代码会去掉，只在最后添加一些注释。没有constvarPostStatus;(function(PostStatus){PostStatus[PostStatus["Draft"]=0]="Draft";PostStatus[PostStatus["Unpublished"]=1]="Unpublished";PostStatus[PostStatus["Published"]=2]="Published";})(PostStatus||(PostStatus={}));varpost={title:'HelloTypeScript',content:'content',status:PostStatus.Published//1//0};添加了const的编译代码//上面的PostStatus将被删除并替换为正下方的值varpost={title:'HelloTypeScript',content:'content',status:2/*Published*///1//0};TypeScript学习地图
