Typescript ｜青训营笔记TS - JS的超集，对于类型检测有了非常好的支持，解决了JS弱类型的痛点，让平时开

简介

官方对于typescript的定义是JS的超集，所以ts本质是对js的扩展，新增了一些东西

Typescript	Javascript
强类型，支持静态和动态类型	动态弱类型
可以在编译期间就检测出错误	只能在运行时发现错误
不允许修改变量类型	变量类型可以被修改

基础

基础类型

string，number，boolean

原始类型：string，number和boolean (The primitives)，这三个都是Javascript中非常常用的原始类型

undefined，null

JavaScript 有两个原始类型的值，用于表示空缺或者未初始化，他们分别是null和undefined

any，unknown，void

TypeScript 有一个特殊的类型any，当不希望一个值导致类型检查错误的时候，就可以设置为any

never

当进行收窄的时候，如果把所有可能的类型都穷尽了，TypeScript 会使用一个never类型来表示一个不可能存在的状态

Array[]

声明一个数组类型，比如数字数组，需要用到number[]

tuple

特殊的数组类型，知道该数组中具体有多少元素，每个特定位置的元素是什么类型

函数类型

函数是任何应用的基础组成部分，无论它是局部函数（local functions），还是从其他模块导入的函数，亦或是类中的方法

使用TS可以定义函数的输入参数类型和输出类型，如果一个函数参数的类型并没有明确给出，它会被隐式设置为any，输出的类型一般会自动推导，没有返回值的时候默认为void类型。另外函数还可以实现函数重载，名称相同但是参数不同，可以通过重载支持多种类型。

函数类型表达式

最简单描述一个函数的方式是使用函数类型表达式，写法类似于箭头函数：

function greeter(fn: (a: string) => void) {
  fn("Hello, World");
}
 
function printToConsole(s: string) {
  console.log(s);
}
 
greeter(printToConsole);

语法 (a: string) => void 表示一个函数有一个名为 a ，类型是字符串的参数，这个函数并没有返回任何值

interface

接口声明（interface declaration）是命名对象类型的另一种方式：

interface Point {
  x: number;
  y: number;
}
 
function printCoord(pt: Point) {
  console.log("The coordinate's x value is " + pt.x);
  console.log("The coordinate's y value is " + pt.y);
}
 
printCoord({ x: 100, y: 100 });

interface特点：

可选属性，用 ? 修饰
只读属性 - readonly
可以描述函数类型
可以描述自定义属性

interface和type的不同：

类型别名和接口非常相似，大部分时候，可以任意选择使用。接口的几乎所有特性都可以在 type 中使用，两者最关键的差别在于类型别名本身无法添加新的属性，而接口是可以扩展的。

// Interface
// 通过继承扩展类型
interface Animal {
  name: string
}

interface Bear extends Animal {
  honey: boolean
}

const bear = getBear() 
bear.name
bear.honey
        
// Type
// 通过交集扩展类型
type Animal = {
  name: string
}

type Bear = Animal & { 
  honey: boolean 
}

const bear = getBear();
bear.name;
bear.honey;

class

TS中类的写法和JS差不多，增加了一些定义

增加了public，private，protected修饰符
抽象类：只能被继承，不能被实例化，作为基类，抽象方法必须被子类实现
interface约束类，使用implements关键字

进阶

泛型

对于TS的泛型，我自己在使用TS的过程中对它的理解就是它是一个参数，就像函数传参一样，只不过它传的是类型

function identity(arg) {
  return arg
}

如果我们想要一个传入什么就输出什么的函数，那它的类型应该怎么处理呢，很容易想到的是any

function identity(arg: any): any {
  return arg
}

但是这样如果我们传进的是数字类型number，我们拿到的函数返回结果却是any类型的，我们希望拿到的结果类型和传入的类型是一致的

function identity<Type>(arg: T): T {
  return arg
}

使用泛型就可以解决了

Typescript ｜ 青训营笔记

简介

基础