TypeScript初识 | 青训营笔记

和dalao一起做项目的时候，由于我不会ts，导致dalao为了迁就我又用回了js，趁此良机。

贴一个官方文档：文档简介 · TypeScript中文网 · TypeScript——JavaScript的超集 (tslang.cn)

JavaScript 与 TypeScript 的区别

TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。

TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。

简单来说就是更多更快更安全

基础知识，快速上手

1、基础类型

• 常用：boolean、number、string、array、enum、any、void
• 不常用：tuple、null、undefined、never

const count: number = 20210701;

2、对象类型

简单理解interface 和 type 的区别：type 更强大，interface 可以进行声明合并，type 不行；

interface Hero { 
name: string; age: number; 
skill: string; 
skinNum?: number; 
say(): string; // say函数返回值为string
[propname: string]: any; // 当前Hero可定义任意字符串类型的key 
} 
// 继承 
interface littleSoldier extends Hero {
rush(): string; 
} 
// 任意类型 
interface IAnyObject { 
[key: string]: any;
}

type Hero = {
name: string, 
age: number, 
skill: string,
skinNum?: number, 
};

看个人习惯，一般声明都用interface，需要用到其他变量类型，type多一些。

3、数组类型

项目中常见的写法，需要声明列表数据类型：

4、元组 tuple

元组和数组类似，但是类型注解时会不一样

赋值的类型、位置、个数需要和定义（生明）的类型、位置、个数一致。

// 数组 某个位置的值可以是注解中的任何一个 
const LOL: (string | number)[] = ["zed", 25, "darts"]; 
// 元祖 每一项数据类型必须一致 
const LOL: [string, string, number] = ["zed", "darts", 25];

进阶知识，迅速拔高

泛型

设计泛型的关键目的是在成员之间提供有意义的约束，这些成员可以是：类的实例成员、类的方法、函数参数和函数返回值。

它更像是为后面要修改的部分占个座位，这样等要微微变形的时候就可以直接拿来用

这一部分我没有实敲过代码，目前也没时间加深学习，按照视频讲的，举个例子

比如要写一个方法，得到一个值并且返回。

function identity (value) {
    return value; 
} 
   
console.log(identity(1)) 

如果我不只想返回普通的值呢？而是给他什么他都能还回来，就可以用泛型，就完美解决了。

function identity <T>(value: T) : T {
    return value; 
}
console.log(identity<Number>(1)) // 1

我不想只是跟着视频把视频里ppt的字抄下来，等我实际用过了再回来补充吧。