前言
小伙伴们大家好。从今天开始我们将从零开始系统的学习一些TypeScript相关的知识。相信小伙伴们或多或少应该也都听说过这玩意了,那么这家伙是干嘛的呢,已经有JavaScript了为什么又要搞出个TypeScript,接下来就为大家一一揭晓。
TypeScript
TypeScript是个啥,它跟JavaScript又有啥区别?
- TypeScript是由微软团队开发的一种开源、自由的编程语言。
- TypeScript是JavaScript的一个超集,支持ES6的所有标准。
- TypeScript是一种能给JavaScript添加特性的扩展语言。
- TypeScript的设计一般是针对开发大型应用或者大型开发团队。因为它能够让你的代码更规范,类型更明确,维护更方便。尤其是多人合作开发一个功能模块,或者是封装一套公共的组件库时效果尤为显著。
- TypeScript最后可以编译成JavaScript,然后在各种浏览器上运行。
- TypeScript扩展了JavaScript的语法,因此JavaScript和TypeScript可以共同工作,并且TypeScript能够完全识别JavaScript的代码。
- TypeScript的适用场景:TypeScript的设计一般是针对开发大型应用或者大型开发团队。因为它能够让你的代码更规范,类型更明确,维护更方便。尤其是多人合作开发一个功能模块,或者是封装一套公共的组件库时效果尤为显著。
- 另外个人理解:TypeScript更类似于后端的强类型语言(如Java),因为它可以在声明变量时指定类型,可以指定函数是否有返回值以及返回值的类型,还可以定义类、枚举、泛型,接口等等。
说了这么多理论还是不便于大家理解,TypesScript到底是个啥玩意,下面我们就先从它的使用开始一边coding一边学习把。
TypeScript安装
要想使用TypeScript首先得先把它安装在我们的环境中,然后才能够使用。TypeScript的安装也是非常简单的,只需要在命令行中运行:npm install typescript -g 即可将其安装在我们的全局环境中。那么安装完成后还需要看下是否安装成功,同样在命令行中运行:tsc -v 如果输出了版本号则表示对应版本号的TypeScript已经安装成功。
npm install typescript -g
## 安装完成后查看是否成功
tsc -v
# 输出:"对应的版本"
TypeScript语法及与JavaScript的区别
TypeScript的语法跟JavaScript的是一样的:
- 用var、let或const声明定义一个变量/常量
- 用function个定义一个函数
- 用class声明一个类
- 用new来创建一个对象
- 支持if/else判断条件
- 支持for/for…of/for…in/while循环
- 用console.log在控制台打印数据
- 用//进行单行注释,用/**/多行注释等等
但与JS不同的是:
- TS在声明变量时可以同时限定变量的类型,而JS是在赋值时才能够确定变量的数据类型
- TS在定义函数时可以同时指定函数的参数类型,返回值及返回值类型,而JS的参数类型是函数调用时才能够确定,返回值类型则是由return决定
下面我们用代码来演示一下:
TypeScript 声明变量的语法: var/let/const 变量名:类型 = 值
//声明一个指定类型的变量/常量
let