Skip to content
Linbudu's Blog

从第一篇 TypeScript 小作文,到极客时间、前端早早聊、掘金小册

2 min read

上个月,我的掘金小册 TypeScript 全面进阶指南 正式上线了,我献祭了接近三个月的所有周末与假期,与 TypeScript “全面”地进行了一次周旋,写下这全文接近 15w 字的拙作。而回想我第一次接触 TypeScript ,到现在的一路打怪升级,很难不让人想到“世事难料”这个词。

故事还要从很久以前说起

大概是在 2020 年 2 月左右,TypeScript 3.8 版本 发布,而我大约就是在此时开始学习 TypeScript 的。那时疫情刚刚初露苗头,开学一延再延。而刚刚开始准备投递大三暑期实习的我,在家里进行了一段压力堪比高三的学习时期,而想不到的是,那时接触到的几个技能会一路伴我至今,并被我作为重点发展的几个方向:TypeScript、GraphQL 与前端工程。说来也怪,在找到实习以及成功转正后,我还贪婪地接触了非常多的技能,比如 SSR、微前端、Angular 全家桶、Serverless 等等,但我再也没能成功地培养起第四样,让我有足够兴趣进行深入的技能。

GraphQL 相对冷门,而前端工程则是很广的概念,我也不敢说自己完全精通了它们。但本文的主角 TypeScript,我确实认为,自己已经达到了“能作为吃饭家伙”的程度。

然而在最开始,我也只是一个自学 JavaScript 半年都写不来网站的平平无奇转码小笨比罢了。本着吃水不忘挖井人的良好品质,我最需要感谢的就是 家园工作室,以及我的三位前端引路人:ZebWuLencondaFuzzyFade。感谢的话不多说,有机会请他们按脚就好。接下来,来谈谈我开始学习 TypeScript 以后的故事。

向每一位自学者表示敬意

我在小册里提到过一句话:向所有非科班自学 JavaScript 成功入门的同学表示敬意,这句话同样可以改成,向所有仅有 JavaScript 经验,却能自学 TypeScript 到还不错程度的同学表示敬意。

如果仅仅比较难度,无疑前者更难,毕竟非科班这个前提下,大概率你是没有任何编程经验的,此时即使是学习 JavaScript 这门相对简单的语言,也是非常痛苦的事情。而从 JavaScript 到 TypeScript,你其实至少理解了编程语言的本质,更何况 TypeScript 和 JavaScript 本来也有着密切关系。

在最初开始学习 TypeScript 时,我的表现可能会让很多人有共鸣:搜罗一大堆学习资源,包括文档视频网课等等。虽然到现在我也没全部看完,但光是看着列表里满满当当的学习资源,就会让我感觉无比充实——加入收藏夹===学会了。

如果你想了解我是如何从零基础开始学习 TypeScript 的,那么你恐怕要失望了,毕竟时间已经过去这么久了。但如果让我推荐适合零基础同学的教程,我会推荐这么几样:xcatliu 老师 的 TypeScript 入门教程冴羽老师的入门到进阶教程,以及官方文档!!!

认真地说的话,TypeScript 的官方文档才是最好的学习资源,社区所有的 TypeScript 学习资源,当然也包括我的,都是直接或间接脱胎于官方文档。但官方文档的内容分布方式对于部分同学来说并不太习惯,也并没有很好地按照难度进行循序渐进的划分。如果你属于自学能力较强的同学,直接看官方文档就够了。

学习一门新的语言的过程确实是非常痛苦的,即使它和 JavaScript 如此相似,但从未见过的类型、新的语法与 API(其实就是 ECMAScript 语法啦)与工具,以及看都看不懂的类型报错,怎么配置都跑不起来的项目,希望你能成功熬过来。

第一篇小作文

在 2020 年 10 月份,我将当时自己所有的 TypeScript 知识写成了一篇文章:TypeScript 的另一面:类型编程

注意这个题目,即使到现在,这也代表着我对 TypeScript 的核心理解:类型编程 + ECMAScript 语法。当然,如果更严谨一些,其实还需要包括工程侧的部分,但那时这一思路就已经给予了我非常大的帮助,让我能将所有纷繁的概念成体系地区分开来。

现在看来,这篇文章的内容其实有很多不咋完善的地方,比如缺少了后面我在所有分享和答疑中都会花非常多篇幅讲解的类型系统部分。原因很简单,那时的我还没意识到这么一位重量级选手存在。但对于类型基础、类型工具与类型编程等几个部分,这篇文章中的介绍思路,其实到现在也是我的基本思维框架。

如果你希望了解 TypeScript 更精细、更具体的划分,可以参考下面这张小册中的思维导图:

这就是我的第一篇 TypeScript 小作文,接下来,事情就开始往奇怪的方向发展了...

事情开始往奇怪的方向发展了

QCon+:淘宝店铺 TypeScript 研发规范落地

在 2021 年的 8 月左右,我的学长 繁易 问我,是否有兴趣参加 QCon+ 的专题分享,他把上面提到的那篇类型编程小作文发给了 Qcon+ 的小编,总之就是一致认为我已经可以出去献丑了。听到这个消息时,我的第一反应是,我还有事先走了。对当时的我来说,在 QCon+ 这样的平台分享是非常 amazing 的事,我觉得自己并没有达到这个程度,不论是技术深度还是实践积累。

经过我可爱学长的一番循循善诱,我最后还是应了这个活,这可能是我在多灾多难的 2021 年最明智的决定之一。通过这次分享我收获了很多,比如不再畏惧对外分享自己的技术观点,比如意识到需要有一门掌握够深的技术作为安身之本,以及认识了靠谱又专业,贴心又热情,会起大早喂猫猫的 QCon+ 小编。

而第一次对外分享的准备过程,现在想来也有够坎坷,确定选题、确定内容、PPT、腹稿,是的腹稿,为了避免卡壳和露怯,我先写了大概 1.5w 字的腹稿,确保记忆得足够清晰,吐字足够流利才开始最后的视频录制,这就更耗费精力与时间了,但如今回想全都是宝贵的经验,比如第二次参加分享,基本上准备充分以后就是一遍过。

视频录制完毕、课程上架以后,我是感觉想要好好休息一段时间,但新的机会几乎是直接撞我脸上来的。

早早聊大会:前端搞 TypeScript

在神光老师(公众号:神光的编程秘籍)的推荐下,Scott 老师邀请我在前端早早聊大会的 TypeScript 专题 分享,这一次的主要分享内容就是 TypeScript 类型系统,实际上也是从这一次准备开始,我意识到类型系统简直可以说是最好的对外分享题材。

首先,类型系统并不需要你对 TS 掌握得多熟练,但只要你入了门,无论处于何种阶段,掌握类型系统都能让你在往后的学习中达到知其然知其所以然的境界。

其次,类型系统是离日常开发最近的理论知识,它不像类型体操那样烧脑又缺少足够实际意义,而是足够接地气,结构化类型系统和类型层级让你明白类型兼容性的本质,上下文类型让你发现另一个方向的类型推导,而协变与逆变又让你理解函数类型的兼容性规则。基本上每一个类型系统的概念,都能或多或少地在日常开发中帮到你。

最后则是因为,类型系统目前在社区中的讲解资源非常之匮乏,大量的社区资源要么是新手向的入门文章,要么是所有知识点罗列一遍的填鸭式教学(就像我上面写的那篇一样),很少能看到有资源对类型系统进行全面梳理。这样一来,当我去分享类型系统时,就能确保听众们一定是 get 了新知识,会觉得这次来对了,讲师大大太帅了。

如果你在阅读完这部分内容后,开始创作类型系统的文章,我的建议是按照上面思维导图中的几个概念进行讲解,当然,我也不介意你顺便提我一嘴?

扯远了,在早早聊直播的时候出现了很尴尬的代码表现不符问题,后面再看其实就是一个很简单的变量声明导致的。当时想着实时直播呢,紧张得不行,只能敷衍大家:这个部分可以去看 github 的代码。除了这个小小的纰漏以外,我觉得整场分享的内容还是非常非常干的,比如我的某位同事反馈振聋发聩、茅塞顿开、原地飞升。

而在早早聊分享完 TypeScript 类型系统以后,QCon+ 2022 又启动了,见过世面的初生牛犊,这次准备再挑战一下自己。

QCon+:TypeScript 类型系统实战课 & 业务场景下的 Monorepo 方案

在 2022 的 QCon+ 中我参加了两个专题的分享,和 zoomdong 一起参加的 基于 Monorepo 的前端工作流 专题,这可以视为前端工程的一部分。以及一个人挑大梁的 TypeScript 类型系统实战课:自顶向下学习类型系统 专题,是的,又是类型系统,这个题材真的太好用了!

实际上,在准备这两个分享的同时,我还在准备下面会提到的小册,因此这段时间我甚至连健身和电竞都牺牲了,睁眼就是今天要写完哪些内容,闭眼是明天得写完哪些内容。

虽然还是类型系统,但这次和早早聊的题材略有不同,毕竟人总是在成长的嘛。这次分享的内容包括了结构化类型系统、类型层级、分布式条件类型,以及从类型系统层面入手的结构工具类型编程。

这里可以插一嘴,我个人特别喜欢对各种知识点进行分类,比如类型编程这个热门话题我就分成了结构工具类型、访问性修饰工具类型、集合工具类型以及模式匹配工具类型四种范式。原因无他,这样真的比较容易学!

就这样,第二次 QCon+ 分享也圆满结束了,我的面前还剩 2022 年的最后一座大山:掘金小册。

掘金小册:TypeScript 全面进阶指南

我最早接触到的一本掘金小册应该是在 2020 年,三元的 React Hooks 与 Immutable 数据流实战 ,那时我还处于入门阶段,应该还没接触到 TypeScript 。这本小册让当时的我受益良多,而这也是我对掘金小册的最初印象:高质量的知识体系。在那时我其实就想过,未来有机会也要将一门手艺写成小册,帮助更多人完成自己的突破,就像我是如何受帮助的一样。

在今年的 3 月份,我突然意识到好像时机成熟了。最开始我提交的选题其实不是 TypeScript,甚至都没有考虑到 TypeScript ,和耐心又专业的掘金小编(目前我遇到的编辑老师真的都太棒了)确认了几个题目之后我突然意识到,这不是有现成的题材吗?

接下来的过程就不多说了,确认目录,确认内容,样章,正式写作,上架准备...,从 3 月到 6 月的周末再也没有完整过,一天屏幕使用时间 9 个小时似乎也成了家常便饭,对了,工作日的晚上也别想闲着,虽然白天动脑了一天比较累了,但你还可以修改下之前写的内容呢?

之所以使用这么高强度的方式,是因为我把整本小册的正文内容都完成了。我不太习惯断断续续的写作方式,那样需要额外的时间来恢复上下文。同时一次性集中写完,也能让你对小册中的关联内容记忆得更清楚,写到一处时能想到其他地方是否漏了什么。现在想来都是辛酸泪,可能是因为强度过高,小册内容完成后,直到现在,我都对 TypeScript 暂时失去了兴趣...,原本预计在小册后更新的专栏文章也统统鸽置了(当然,还有一个原因是基本上都写进小册了)。

如果你有兴趣详细了解,直接阅读免费的 开篇部分 就好,我会比较正式地说明它的优势。但在这里,还是让我们随意点吧。如果熟悉的人问我里面都写了什么,我会说你学完之后 TS 水平就跟我完全一样了(真的一点没藏私)。如果是不太熟悉的人,我会说你学完之后 3 年经验内岗位横着走。敢这么嚣张至少是有底气的,一方面是内容分量确实足足的,另一方面则是其中的学习路线,类型基础-类型工具-类型系统-类型编程-工程实战,这一套组合拳下来你就是想假装学不会都难。此时我不禁感叹,要是当年入门有这本教程,我少走的弯路又何止十八重。

自我夸赞就到这里,这里放个 7 折优惠码 3dCjtSk9,有兴趣的同学可以自取,如果优惠码失效或耗尽使用次数,你也可以在公众号「林不渡也不是不能渡」发送小册来获得优惠码~

似乎有点打广告的嫌疑?但不重要,毕竟我对这本小册的质量是如此有信心,总会有好兄弟读完之后疯狂地按头安利给同事的。同时,随着小册的上架,似乎又来了新的机会,由于不确定性比较高,在这里我只能说,未来你可能有机会买到我的实体书。

尾声

在最后,除了上面我已经说到的这些分享,其实你也可以在知乎账号「林不渡」,或公众号「林不渡也不是不能渡」、「大淘宝技术」、「Alibaba F2E」等等这些来源,找到我的 TypeScript 专栏,我会随着版本更新发布 TypeScript 的更新日志解读,以及各种有趣的 TypeScript 小知识。

回想这两年多来学习 TypeScript 的历程,我再次感觉到了「相信过程」的重要性,很多时候你的投入并不会立刻给予你回报,它们会偷偷躲起来,直到积攒到足够大的分量才会怼你脸上。也因此,「持续投入」和「相信过程」就是我最常使用的信条之二,希望与你共勉。