TypeScript入门|青训营笔记这是我参加[第五届青训营]伴学笔记创作活动的第4天本堂课堂知识了解通过发展历史和

这是我参加[第五届青训营]伴学笔记创作活动的第4天

本堂课堂知识

了解通过发展历史和语言优势需要学习TS的原因
了解TS基本语法
了解通过高级类型的方式，将普通类型的解决方案进行高级化

TypeScript发展历史

由图可知，三个主流前端框架都有了对应的TypeScript的版本

TypeScript语言优势

比较点	JavaScript	TypeScript
语言类型	弱类型语言	弱类型语言
编译在执行的时机	动态：将脚本粘贴在控制台后回车即可执行报错直接显示，执行/编译阶段进行类型匹配/检验	静态：编译前进行类型匹配，编译完后在可执行场景执行，如java，python
语言类型	弱类型语言	弱类型语言

tips：弱类型语言-可以类型转换，比如1+“1”可以计算，但在强类型语言中就会类型不匹配报错

TypeScript的特征

静态类型

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

JS的超集

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

编辑器推荐：VS Code、TS官网在线编译器

TypeScript的基本语法

从JS代码到认识TS的代码来比较两者的差异

基础数据类型

基础数据类型是相同的，只不过TS在变量后新增":变量类型"

对象类型

对象类型通常都是自定义，约定习惯是对象类型都带有一个大写的i来表示

函数类型

类型声明的方式

1.直接在函数上进行类型补充（图最下）

function 函数名(变量1:变量类型,变量2:变量类型):返回值类型{ 
   return 函数操作;
}

2.给函数变量赋值一个函数类型声明（图最下）

const 函数名:(变量1:变量类型,变量2:变量类型)=>返回值类型 =(变量1,变量2) => 函数操作;

3.有时候以上写法会过于冗长，则可以采取以下interface的写法：（图右上）

interface I对象名 {
  (变量1:变量类型,变量2:变量类型):返回值类型;
}
const 对象名：对象函数 = (变量1,变量2) => 函数操作;

函数重载案例

函数签名（重载签名）= 函数名称+函数参数+函数参数类型+返回值类型
eg.function funa(value: number, type: string): string 解决方案：
IGetDate范围表达大于getDate2匿名函数范围表达（调大范围？）
把interface中第三行的timestamp类型改为any即可通过,别人是成功的，但我自己试的时候仍然报错，代码截图如下，今天初步学习ts还不太熟悉没调试出来，如果今后学完解决了放评论，也欢迎大家一起交流