TypeScript | 青训营笔记

200mak1r
60 阅读1分钟

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

TypeScript概述

静态类型
    可读性增强：基于语法解析TSDoc，ide增强；
    可维护性增强：在编译阶段暴露大部分错误 => 多人合作项目，获得更好的稳定性和开发效率；
JS的超集
    包含于兼容所有JS特性，支持共存；
    支持渐进式引入与升级；

基础数据类型

Snipaste_2023-02-01_14-03-54.png

对象类型

image.png

函数类型

image.png

函数重载

image.png

数组类型

image.png

TypeScript补充类型

image.png

TypeScript泛型

image.png

image.png

类型别名&类型断言

image.png

字符串/数字 字面量

image.png

联合/交叉类型

联合类型
    IA | IB；
    联合类型表示一个值可以使几种类型之一；
交叉类型
    IA & IB;
    多种类型叠加到一起称为一种类型，它包含了所需的所有类型的特性；

image.png

类型保护与类型守卫

image.png

image.png

函数返回值类型

image.png

image.png

TypeScript工程应用

webpack
    1.配置webpack loader相关配置；
    2.配置tsconfig.js文件；
    3.运行webpack启动 / 打包；
    4.loader处理ts文件时，会进行编译与类型检查；
    
Node
    1.安装Node与npm；
    2.配置tsconfig.js文件；
    3.使用npm安装tsc；
    4.使用tsc运行编译得到js文件；

总结

    在良好的JS的知识储备和了解Java等后端语言作为支撑的前提下，TS的学习相对来说较易掌握，
比较与JS的异同点，会是一个快速上手的好方法；
avatar
文章
阅读
粉丝