【干货】写给初中级前端的高级进阶指南

以下文章来源于掘金开发者社区，作者晨曦时梦见兮

我曾经一度很迷茫，在学了Vue、React的实战开发和应用以后，好像遇到了一些瓶颈，不知道该怎样继续深入下去。相信这也是很多一两年经验的前端工程师所遇到共同问题，这篇文章，笔者想结合自己的一些成长经历整理出一些路线，帮助各位初中级前端工程师少走一些弯路。

笔者毕业于一个很普通的本科学校，目前开发经验一共是2年8个月，目前带一个5人的团队，前任的组长让我带领团队的主要原因是个人技术 + 沟通能力相对较好，但是在技术能力成长的背后我也走了不少弯路。

这篇文章会提到非常非常多的学习路线和链接，如果你还在初中级的阶段，不必太焦虑，可以把这篇文章作为一个进阶的路线图，在未来的时日里朝着这个方向努力就好。

我也并不是说这篇文章是进阶高级工程师的唯一一条路线，如果你在业务上做的精进，亦或是能在沟通上八面玲珑，配合各方面力量把项目做的漂漂亮亮，那你也一样可以拥有这个头衔。本文只是我自己的一个成长路线总结。本篇文章面对的人群是开发经验1到3年的初中级前端工程师。

基础能力

我整理了一篇中级前端的必备技术栈能力，写给女朋友的中级前端面试秘籍 。这篇文章里的技术栈当然都是需要扎实掌握的，（其实我自己也有一些漏缺，偷偷补一下）。

当然了，上进心十足的你不会一直满足于做中级前端，我们要继续向上，升职加薪，迎娶白富美！

JavaScript

原生js系列

冴羽大佬的这篇博客里，除了undescore的部分，你需要全部都能掌握。并且灵活的运用到开发中去。
JavaScript深入系列、JavaScript专题系列、ES6系列

完全熟练掌握eventLoop。

tasks-microtasks-queues-and-schedules

Promise

你需要阅读Promise A+规范，注意其中的细节，并且灵活的运用到开发当中去。
Promise A+ 英文文档
你需要跟着精品教程手写一遍Promise，对里面的细节深入思考，并且把其中异步等待、错误处理等等细节融会贯通到你的开发思想里去。
剖析Promise内部结构，一步一步实现一个完整的、能通过所有Test case的Promise类
最后，对于promise的核心，异步的链式调用，你必须能写出来简化版的代码。
最简实现Promise，支持异步链式调用（20行）
题外话，当时精炼这20行真的绕了我好久 ，但是搞明白了会有种恍然大悟的感觉。这种异步队列的技巧要融会贯通。
async await

对于Promise我们非常熟悉了，进一步延伸到async await，这是目前开发中非常非常常用的异步处理方式，我们最好是熟悉它的babel编译后的源码。

手写async await的最简实现（20行搞定）
babel对于async await配合generator函数，做的非常巧妙，这里面的思想我们也要去学习，如何递归的处理一个串行的promise链？

这个技巧在axios的源码里也有应用。平常经常用的拦截器，本质上就是一串promise的串行执行。

当然，如果你还有余力的话，也可以继续深入的去看generator函数的babel编译源码。不强制要求，毕竟generator函数在开发中已经用的非常少了。
ES6 系列之 Babel 将 Generator 编译成了什么样子

异常处理

你必须精通异步场景下的错误处理，这是高级工程师必备的技能，如果开发中的异常被你写的库给吞掉了，那岂不是可笑。
Callback Promise Generator Async-Await 和异常处理的演进

插件机制

你需要大概理解前端各个库中的插件机制是如何实现的，在你自己开发一些库的时候也能融入自己适合的插件机制。
Koa的洋葱中间件，Redux的中间件，Axios的拦截器让你迷惑吗？实现一个精简版的就彻底搞懂了。

设计模式

对于一些复杂场景，你的开发不能再是if else嵌套一把梭了，你需要把设计模式好好看一遍，在合适的场景下选择合适的设计模式。这里就推荐掘金小册吧，这个作者的质量我信得过。