- 枚举 `Enum`

使用枚举类型可以为一组数值赋予友好的名字

- 元组 `Tuple`

允许数组各元素的类型不必相同。 比如，你可以定义一对值分别为 string和number类型的元组

- 任意值 `Any`

表示任意类型，通常用于不确定内容的类型，比如来自用户输入或第三方代码库

- 空值 `Void`

与 any 相反，通常用于函数，表示没有返回值

- 接口 `interface`

类型契约，跟我们平常调服务端接口要先定义字段一个理

交叉类型(Union Types)，表示一个值可以是几种类型之一。 我们用竖线 | 分隔每个类型，所以 number | string | boolean表示一个值可以是 number， string，或 boolean

type arg = string | number | boolean

const foo = (arg: arg):any =>{

console.log(arg)

}

foo(1)

foo('2')

foo(true)

函数重载（Function Overloading）, 允许创建数项名称相同但输入输出类型或个数不同的子程序，可以简单理解为一个函数可以执行多项任务的能力

例我们有一个`add`函数，它可以接收`string`类型的参数进行拼接，也可以接收`number`类型的参数进行相加

function add (arg1: string, arg2: string): string

function add (arg1: number, arg2: number): number

function add <T,U>(arg1: T, arg2: U) {

// 在实现上我们要注意严格判断两个参数的类型是否相等，而不能简单的写一个 arg1 + arg2

if (typeof arg1 === 'string' && typeof arg2 === 'string') {

return arg1 + arg2

} else if (typeof arg1 === 'number' && typeof arg2 === 'number') {

return arg1 + arg2

}

}

add(1, 2) // 3

add('1','2') //'12'

通过本篇文章，相信大家对`Typescript`不会再感到陌生了

下面我们来看看在`Vue`源码`Typescript`是如何书写的，这里我们以`defineComponent`函数为例，大家可以通过这个实例，再结合文章的内容，去理解，加深`Typescript`的认识

export function defineComponent<Props, RawBindings = object>(

setup: (

props: Readonly<Props>,

ctx: SetupContext

) => RawBindings | RenderFunction

): {

new (): ComponentPublicInstance<

Props,

RawBindings,

{},

{},

{},

// public props

VNodeProps & Props

>

} & FunctionalComponent<Props>

export function defineComponent(options: unknown) {

return isFunction(options) ? { setup: options } : options

}

本文作为Vue3源码系列的开篇词，以问答形式来诠释为什么程序员要学习源码

大部分程序员都只会写代码（改，抄，`stackoverflow`工程师，代名词: 搬砖），会阅读代码的很少，为什么呢？因为国内所有的教育，网课，培训都没有教你怎么去看代码，只教你怎么去写代码

再者基于现在的程序员工作模式(模块化开发，只需要拿到需求做自己的部分)，别说看源码，甚至就连项目里的代码都懒的去看，我认识的很多程序员就是这样的，一个项目摸了两三年，你要问他项目中`webpack`都干了哪些事情，他的回答是不知道，反而趾高气扬的告诉你，那些他从来都用不上，看了也没什么用，也看不懂，这里省略内心千字脏文

阅读代码其实就咱们跟阅读一本小说一样，看过玄幻小说才能说出来修仙，看过都市的才能讲出来穿越

前面有提到优秀的高分作文看多了你才能写出来高分作文，你天天看着0分作文，那么写出来的大概率也自然是0分作文，什么样的作文算是高分呢？这个很好区分，前期从众就好

井底之蛙是大家应该都熟悉的故事，大多数时候我们会给自己画一个圈，将同事的技术跟自己的技术做对比，或者将`TL`的技术跟自己做对比，经常有人向我吐槽说，同事的技术不如他为什么工资比他高，`TL`的技术也不怎么样，为什么能成为`TL`，现在给你的回答是，**"因为你以为的并不是你以为的"**

我们完全没有必要把时间花费在这种毫无意义的事情上面，改变不了环境就改变自己，学会破圈，为什么总有人说北上广深适合创业，因为北上广深的风水爆炸还是空气新鲜？显然都不是，在北上广深无非就是让你的人脉更优质一些，上限更高一点，**你的圈有多大，未来的想象空间才有可能更大**

功利性即指有目的性的，明确知道自己干完某一件事后能得到什么样的回报，所以首先你要知道你想得到什么？

看源码也是一样，你对`vue.use`之后发生了什么比较好奇，或者是你觉得现在面试都需要会看点源码，这都很好，至少你有明确的诉求

**凡事只要有了功利属性，才更容易走的下去，否则就是真香警告**

这种情况一般在是自己写需求遇到问题了，或者突然一时兴起想看看内脏的同学，可以直接粗暴的找到源码的仓库，直接在该仓库搜索关键字，然后根据模糊搜索的结果再结合自己的理解选择合适的结果，以下以`Vue.use`为例，如下图

我们可以看到第一个结果就是`.spec` (Standard Performance Evaluation Corporation，标准性能评估机构bai) 可以理解为代码的试金石，优秀开源代码的标配，直接代表着代码的稳健性

点进去我们看到的代码如下，从图中我们就能大致的猜到`Vue.use`的一些使用场景及边界值

即指以项目为维度的源码阅读，这种方式比上面的单点突破价值就要大很多，读完之后，不仅可以知道执行一个Api时具体发生了什么，更重要的是能学习到项目整体的设计思想和架构理念

- 决心(事事把决心放第一)

- 对你所阅读的代码框架要有基本的了解(不然你读个啥)

- 设定一个计划并自我复盘总结

- 理清楚代码组织关系及用途

- 多跟自己交互(带问题阅读)

科普一下`SourceMap`这个东西吧，分开念`Source` `Map`，一句话理解就是一段维护了前后代码映射关系的`json`描述文件，具体故事可以泡杯茶慢慢讲了，这里不过多描述，感兴趣的自行查阅相关文档

接下来让我们一起遨游在源码的海洋里吧!