TypeScript是微软开发的一种开源编程语言,它是在JavaScript的基础上加入静态类型定义而构建的。TypeScript更具表现力,这意味着它的语法混乱更少,调试很容易,因为高级调试器专注于在编译前捕获逻辑错误,静态类型使TypeScript比JavaScript动态类型更易于阅读和结构化,多亏了常见的转译器,它可以在客户端和服务器端项目中跨平台使用。TypeScript通过TypeScript编译器或Babel翻译成JavaScript代码,可以运行在任何浏览器和任何操作系统上。当前的稳定版本是4.2.3版。TypeScript的主要特点是什么?跨平台:TypeScript编译器可以安装在任何操作系统上,包括Windows、macOS和Linux;支持ES6特性:TypeScript包含大部分计划中的ECMAScript2015(ES6)特性,例如箭头函数;面向对象的编程思想:TypeScript提供了所有标准的OOP特性,例如类、接口和模块;严格的静态类型检查:TypeScript使用静态类型并在编译时帮助进行类型检查,因此您可以在编写代码时发现编译时错误而无需运行脚本;可选的静态类型:如果你习惯了JavaScript的动态类型(使用变量时可以根据值改变变量的数据类型),TypeScript也允许可选的静态类型(在变量后面加一个冒号+数据类型,并且在使用过程中不能改变其数据类型,否则会报错);DOM操作:可以使用TypeScript操作DOM来增加或删除客户端网页元素;全局作用域:定义在任何类之外,可以在程序的任何地方使用;函数/类范围:函数或类中定义的变量可以在该范围内的任何地方使用;局部作用域/代码块:在局部作用域中定义的变量可以在该块的任何地方使用;TypeScript内置数据类型number类型:用于表示数值类型的值,TypeScript中的所有数字都存储为浮点值;letdecLiteral:number=6;//十进制lethexLiteral:number=0xf00d;//hexadecimalletbinaryLiteral:number=0b1010;//binaryletoctalLiteral:number=0o744;//octalBoolean类型:逻辑二进制开关,只能包含true或false;letisTrue:布尔值=真;字符串类型:可以使用单引号(')和双引号(")来表示字符串类型。此外,它还支持使用模板字符串反引号(`)来定义多行文本和嵌入表达式,使用${expr}形式嵌入变量或表达式;letname:string='Tom';letcity:string='北京';letcontent:string=`他叫${name},住在${city}`;数组类型:TypeScript数组运算对于JavaScript中类似数组的操作,TypeScript建议最好只给数组元素赋一种类型的值。有两种定义数组的方法;letarr:number[]=[2,3];letarr:Array=[2,3];对象类型:object对象类型可以用来描述一个对象;constpeople:object={name:"Tom",age:20,city:'北京',}console.log('他叫${people.name},住在${people.city}');symbol类型:在ES5中,如果我们不能给对象添加相同的属性名,但是我们也可以通过symbol来定义相同的名称,因为Symbol函数返回不同的值;consts1=Symbol("identity");consts2=Symbol("identity");//一个人的多个身份constperson={[s1]:"Principal",[s2]:"Chemistryteacher",}元组类型:元组类型用于表示已知数量和类型的数组,每个元素的类型不必相同;letx:[string,number];x=['Angular',5];//更正x=[5,'Angular'];//错误的枚举类型:枚举是可以命名的整型常量的集合,而枚举类型为集合成员赋予有意义的名称,增强可读性;//枚举类型默认下标为0enumColor{red,yellow,blue};letc:Color=Color.blue;console.log(c);//2//手动设置枚举下标enumColor{red=1,yellow=2,blue=3};letc:Color=Color.blue;console.log(c);//3任意值类型:任意值是使用的一种数据类型通过TypeScript在编程时对于类型不明确的变量,常用的有以下三种;该值可能来自动态内容,例如来自用户输入或第三方代码库在这种情况下,我们不希望类型检查器检查这些值而是让它们直接通过编译阶段检查;letx:any=123456;x='becomesastring';x=false;允许您在编译时选择包括或删除类型检查;letx:any=4;x.toFixed();//对了,不检查是否定义了数组来存储各种类型的数据;letarrarList:any[]=[1,'qwe',true];null和undefined类型:默认情况下null和undefined是所有类型的子类型。也就是说,你可以将null和undefined赋值给number类型的变量;但是,如果启用--strictNullChecks,则可以使null和undefined只赋值给void或其对应的类型;letx:number;x=1;x=null;//更正//启用--strictNullCheckslety:number;y=1;y=null;//报错void类型:用void表示没有类型,例如,函数没有返回值,即returnvoid;functionsayHello():void{console.log('Isaidhello');}naver类型:never是其他类型(包括null和undefined)的子类型,表示从不出现的值,也就是说声明为never类型的变量可以only被never类型赋值,在函数中通常表现为抛出异常或者执行到终止点失败;letx:never;lety:number;x=123;//错误y=x;//正确编译TypeScript文件编译TypeScript文件需要安装TypeScript编译器,使用如下命令安装运行ts;npminstalltypescript-gcd到指定目录tsctypescript_test.ts使用TypeScript创建变量由于支持ES6语法,创建变量的方式有var、let、const三种;varname:string='Tom';var是严格限定范围变量的旧样式。您应该尽可能避免使用var,因为它可能会在较大的项目中引起问题;letnum:number=123;let是TypeScript中声明变量的默认方式。与var相比,let减少了编译时错误的数量,提高了代码的可读性;类型,你可以改变它的内部值),它使用相同的作用域规则,让并有助于降低整体程序的复杂性;TypeScript接口interface为使用接口的对象定义一个契约或结构,接口用关键字interface定义,可以包含使用函数或箭头函数的属性和方法声明;interfacestaffInfo{staffCode:number;staffName:string;getSalary:(number)=>number;getLeaderName(number):string;}TypeScript函数重载在TypeScript重载函数中,只需创建两个具有相同名称但不同参数/返回的函数类型,两个函数必须接受相同数量的参数。这是TypeScript中多态性的一个重要部分,比如你可以创建一个add函数,如果两个参数是数字就相加,如果是字符串就把它们拼接起来,白话就是一个方法传递不同的参数,得到不同的返回价值观;functionadd(a:string,b:string):string;functionadd(a:number,b:number):number;functionadd(a:any,b:any):any{returna+b;}add("你好","Steve");//HelloSteveadd(10,20);//30TypeScript模块TypeScript模块是相关变量、函数、类和接口的集合,你可以将添加模块看作是一个容器,其中包含执行某项任务所需的一切,可以导入模块以轻松地在项目之间共享代码;moduleaddFun{classAdd{exportadd(x,y){returnx+y;}}}一个TypeScript类代表一组相关的共享对象的行为、属性和方法,例如,一个学生类Student。classStudent{stuNum:number;stuName:string;constructor(num:number,name:string){this.stuName=name;this.stuNum=num;}}TypeScript和JavaScript的比较TypeScript是JavaScript的开源语法超集,可编译对于JavaScript,所有原始的JavaScript库和语法仍然有效,但TypeScript添加了JavaScript中没有的额外语法选项和编译器功能。TypeScript还可以与大多数与JavaScript相同的技术交互,例如Vue和jQuery。