Typescript入门|青训营笔记

这是我参与「第四届青训营 」笔记创作活动的的第8天

什么是TypeScript

TypeScript发展历史

• 2012-10：微软发布了TypeScript第一个版本（0.8）
• 2014-10：Angular发布了基于TypeScript的2.0版本
• 2015-04：微软发布了Visual Studio Code
• 2016-05：@type/react发布，TypeScript可开发React
• 2020-09：Vue发布了3.0版本，官方支持TypeScript
• 2021-11：4.5版本发布

什么是TypeScript

静态类型：

• 可读性增强：基于语法解析TSDoc，ide增强
• 可维护性增强：在编译阶段暴露大部分错误=>多人合作的大型项目中，获得更好的稳定性和开发效率

JS的超集：

• 包含于兼容所有Js特性，支持共存
• 支持渐进式引入与升级

编辑器推荐：

基本语法

基础数据类型

/*字符串*/
const q = 'string';
/*数字*/
const w = 1;
/*布尔值*/
const e = true;
/*null*/
const r = null;
/*undefined*/
const t = undefined;

等同于：

/*字符串*/
const q: string = 'string';
/*数字*/
const w: number = 1;
/*布尔值*/
const e: boolean = true;
/*null*/
const r: null = null;
/*undefined*/
const t: undefined = undefined;

对象类型

函数类型

数组类型

工程应用

Web

1. 配置webapack loader相关配置
2. 配置tsconfig.js文件
3. 运行webpack启动/打包
4. loader处理ts文件时，会进行编译与类型检查

相关loader：

1. awesome-typescript-loader
2. babel-loader

Node

使用TSC编译：

1. 安装Node与npm
2. 配置tsconfig.js文件
3. 使用npm安装tsc
4. 使用tsc运行编译得到js文件

个人总结

又初步掌握了一项技能！