一、TypeScript概述
TypeScript是JavaScript的一个超集,支持ECMAScript6(ES6)标准。
TypeScript由微软开发的自由和开源的编程语言。
TypeScript设计目标是开发大型应用,它可以编译成纯JavaScript,编译出来的JavaScript可以运行在任何浏览器上。
语言特性
TypeScript是一种给JavaScript添加特性的语言扩展,其增加的功能包括:
类型批注和编译时类型检查
类型推断
类型擦除
接口
枚举
Mixin
泛型编程
名字空间
元组
Await
以下功能是从ECMA反向移植而来:
类
模块
lambda函数的箭头语法
可选参数以及默认参数
JavaScript与TypeScript的区别
TypeScript是JavaScript的超集,扩展了JavaScript的语法,因此现有的JavaScript代码可与TypeScript一起工作无需任何修改,TypeScript通过类型注解提供编译时的静态类型检查。
TypeScript可处理已有的JavaScript代码,并只对其中的TypeScript代码进行编译。
二、TypeScript安装及环境验证
接下来介绍TypeScript环境的安装,我们需要使用到npm工具安装,npm是node的包管理器,在安装NodeJS时,会同时安装npm工具,关于NodeJS安装参考:
Windows下NodeJS的安装和验证
打开Windows下的命令提示符,输入命令
npminstall-gtypescript
进行typescript工具的安装
安装完成以后,接着输入命令
tsc-v
查看typescript编译器的版本信息
三、TypeScript初步入门使用
通常我们使用.ts作为TypeScript代码文件的扩展名,首先创建一个名为test.ts的文件,里面写上如下两行简单代码
letmsg="Hello,TypeScript";
console.log(msg);
输入命令
tsctest.ts
使用TypeScript编译器进行编译,此时在当前目录下(与test.ts同一目录)就会生成一个test.js文件
通过node命令来运行js脚本
nodetest.js
将会看到信息输出
四、TypeScript初步Web入门
创建一个名为demo.ts文件
类型注解
TypeScript里的类型注解是一种轻量级的为函数或变量添加约束的方式。
比如我们希望sayHello函数接收一个字符串参数。然后尝试把sayHello的调用改成传入一个数组,那么使用tsc编译就会报错
我们创建一个index.html文件,内容如下图所示:
用浏览器运行html网页,看到的内容如下:
以上基础的概念掌握后,剩下的就是熟悉具体的TypeScript语法,使用编程工具,比如VisualStudioCode等根据实际业务进行前端编程开发啦