Typescript入门 | 青训营笔记

66 阅读2分钟

这是我参与「第四届青训营」笔记创作活动的第7天。
以下内容主要介绍了前端的Typescript的入门知识。

一、什么是Typescript

TypeScript是微软开发的一个开源的编程语言,通过在JavaScript的基础上添加静态类型定义构建而成。TypeScript通过TypeScript编译器或Babel转译为JavaScript代码,可运行在任何浏览器,任何操作系统。 TypeScript添加了很多尚未正式发布的ECMAScript新特性(如装饰器 )。
那么让我们了解一下Typescript的历史:

  • 2012-10:微软发布了Typescript第一个版本(0.8)
  • 2014-10:Angular发布了基于Typescript的2.0版本
  • 2015-04:微软发布了Visual Studio Code
  • 2016-05:@types/rect发布,Typescript可开发React
  • 2020-09:Vue发布了3.0版本,官方支持Typescript
  • 2021-11:v4.5版本发布

js(JavaScript)是动态类型,弱类型语言。而ts(Typescript)是静态类型,弱类型语言。首先我们先来说一下动态类型与静态类型的区别。动态类型是指变量类型在执行过程中动态转换,而静态类型是在执行前便已经完成转换。弱类型语言是数据类型能够被忽略的语言。那么前端既然有了js,为什么还要学习ts呢?

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

二、基本语法

1、基础数据类型

image.png

2、对象类型

image.png

3、函数类型

image.png

4、函数重载

image.png

5、数组类型

image.png

6、补充类型

image.png

三、高级类型

1、联合交叉类型

image.png image.png

2、类型保护与类型守卫

image.png image.png

3、高级类型

image.png image.png image.png image.png image.png