这是我参与「第五届青训营 」伴学笔记创作活动的第 13 天
typescript见解
为什么需要TypeScript?
JavaScript是弱类型语言, 动态类型,很多错误只有在执行时才会被发现。
TypeScript也是弱类型语言,静态类型,它提供了一套静态检测机制, 可以帮助我们在编译时就发现错误。
什么是typescript?
TypeScript是JavaScript的超集,它扩展了JavaScript,有JavaScript没有的东西。硬要以父子类关系来说的话,TypeScript是JavaScript子类,继承的基础上去扩展。
TypeScript特点
- 支持最新的JavaScript新特特性
- 支持代码静态检查
- 支持诸如C,C++,Java,Go等后端语言中的特性 (枚举、泛型、类型转换、命名空间、声明文件、类、接口等)
搭建typescript学习环境
安装最新版typescript
npm i -g typescript
安装ts-node
npm i -g ts-node
创建一个 tsconfig.json 文件
tsc --init
然后新建index.ts,输入相关练习代码,然后执行 ts-node index.ts
tsconfig.json 文件配置项解析
-
target: ts要编译成的版本, 默认是 'es5', 如果改成 'es2015',那么 es6 就不会被编译了.
-
module: 输出的代码将会按照什么方式去模块化, 默认是 'commonjs',那么默认导入导出就是 require和 module.exports 的方式
-
outDir: ts文件编译后的文件夹, 一般是dist目录
-
rootDir: 需要编译的文件夹, 一般是 src
-
sourceMap: boolean类型值, 可以查找ts内部文件
-
strict: boolean类型, 开启会对类型检查非常严格, 每个值都需要声明类型
安装 typescript 开发工具
-
推荐 vscode , 链接:code.visualstudio.com/
-
官方也提供了一个在线开发 TypeScript 的编辑器——Playground。基于它,我们无须在本地安装环境,只需要一个浏览器即可随时学习和编写 TypeScript,同时还可以方便地选择 TypeScript 版本、配置 tsconfig,并对 TypeScript 实时静态类型检测、转译输出 JavaScript 和在线执行。对于刚刚学习 TypeScript 的人来说,也是一个不错的选择。
Typescript 基础语法
基础数据类型
如图,我们可以看到ts的类型定义:
对象类型
typescript编写约定中,通常会用I开头表示这是一个自定义类型,用于和普通的对象和类进行区分
函数类型
函数重载
如上代码,函数的编写形式可以说是非常的麻烦,那我们可以使用interface类型去实现。
数组类型
数组类型声明方式:
- 类型[]
- 泛型表示方式:Array<类型>
- 元组表示方式:[类型,类型,类型]
tuple:元组就是固定长度的数组
- 接口表示方式