TS介绍与初体验

基本介绍

安装工具包

编译并运行TS代码

新版编译运行直接用 node hello.js

TS 概述与优势

类型注解

作用：为变量添加类型约束，约定了什么类型，就只能给变量赋值该类型的值

let age: number = 18

TS常用类型

概述

原始类型

数组类型

类型别名

函数类型

特殊的函数返回值类型 void（TS新增的，JS没有）

可选参数

对象类型

可选属性

接口

接口和类型别名的对比：

接口继承

元组

类型推断

类型断言

字面量类型

枚举

枚举成员的值以及数字枚举

字符串枚举

枚举的特点及原理

any类型

typeof 运算符

TS高级类型

概述：

class类

class的构造函数

class类的实例方法

class类 继承

class类 可见性修饰符

readonly 只读修饰符

类型兼容性

1.类的实例(对象)的兼容性

2.接口兼容性

3.函数兼容性

交叉类型

交叉类型(&) 和 接口继承(extends) 的对比

泛型

简化调用泛型函数(类型推断)

泛型约束

1.指定更加具体的类型

2.添加约束

多个泛型变量的情况

泛型接口(类型变量必须指定类型)

拓展：泛型接口的具体使用 -- 数组是泛型接口

泛型类

第一个图片泛型类已经是老版本的了，了解即可，现在用hooks函数

泛型工具类型

1.

2.

3.

4.

索引签名类型

映射类型

1.根据联合类型创建

2.根据对象类型创建

泛型工具类型 - Partial 用映射类型实现 原理

索引查询类型

1.基本使用

2.同时查询多个

TS类型声明文件

1.TS的俩种文件类型

2.类型声明文件的使用说明

类型声明文件的使用包括以下两种方式：

一、使用已有的类型声明文件

1.

2.

 二、创建自己的类型声明文件

1.项目内共享类型

2.为已有JS文件提供类型声明（JS项目做一半升级为TS项目）

在React中使用TS

概述：

使用CRA创建支持TS的项目

TS配置文件 tsconfig.json

TS配置文件 tsconfig.json --- 通过命令行方式使用编译配置

React中的常用类型

React中的常用类型

React函数组件的类型(1函数组件类型和属性)

React函数组件的类型(2属性默认值)

React函数组件的类型(3事件绑定和事件对象)

类函数组件的类型(1组件类型)

类函数组件的类型(2属性和属性默认值)

类函数组件的类型(3组件状态和事件)