来自读者朋友“？”的提问：

我目前大四，今年应届，学习路线是自学，实习经历有两段，第一段在腾讯，技术栈是vue和一点node，第二段在学校附近的公司，现在还在进行，这边是react。

现在的情况大概是这样的，问题的话就是一路以来都是自学，前期学得可能比较零散，基础不太牢固。

然后还有一个比较困惑的就是感觉自己在某些方面处于一个瓶颈期，例如框架这部分，现在慢慢有开始去理解他们的实现方式，但是无法更深入的去感知它们，无从下手。

还有一个问题是拿到一个项目的时候如何去阅读和理解？

耳东分析：

这个问题比较典型，有一些实践经验的初学者已经可以熟练的通过api来做出东西，但是对于难度较大的项目可能难以入手，并且对于技术的原理理解较浅，并且基础知识不够系统。

读者的问题可以总结为：

首先回答下第一个问题，前端基础的问题。

首先要认识到基础知识不只是面试的时候才有用，平时开发中debug和自己写库的时候会经常用到前端基础知识，我可以提供一些常用的和面试常被问到的知识点，供你参考：

CSS：Flex，Grid，盒模型，定位，选择器优先级，两/三栏布局，浮动

JavaScript：闭包和作用域，事件机制，原型，继承方式，this指向，变量声明提升，异步（promise、async/await），event loop，双精度浮点数

自己实现JavaScript函数：防抖/节流函数，apply函数，call函数，bind函数，数组去重/求并集/求交集，对象深拷贝，

网络：跨域，http1.1请求结构，http缓存，http2，cookie/session

浏览器：script标签的defer和async，回流和重绘，页面加载过程以及过程中可能会发生的阻塞

推荐书籍：《你不知道的JavaScript》

学习这些基础知识的要点：

如何鉴定自己是否真的学懂了，有两个方法：一个是学完一个知识点，可以自己试着讲给别人听，如果没有人听你讲可以自己写成文章，写作的过程就是验证你是否学会的过程；另一个是在网上找到相关的面试题，试试能不能答出来
提到的那几个JavaScript函数，一定要自己手动实现
不要看那些又厚又多的砖头书，《你不知道的JavaScript》这套书足矣，并且不要从头看到尾，学到哪个知识点就看书上对应的部分，这样子可以越看越有信心，有不懂的知识点可以去MDN查询

然后回答第二个问题，如何深入前端框架的问题。

首先你现在已经可以很熟练的去实现业务了，说明你在API这一层级已经合格，接下来就是进阶与深入了。

其实关于框架的进阶和深入，我想这里可以分为两个角度，你可以顺着这两个角度去深入（以Vue为例，React同理）。

拆解框架。这是一条自顶向下的道路，比如对于Vue框架来说，你可以问自己几个问题：Vue都帮你解决了什么问题？Vue的代码是如何转化成页面的？思考完这两个问题，我们可以把Vue拆解成以下知识点：

a. 如何理解MVVM？

b. Vue的每个生命周期函数都发生了什么？

c. Vue的响应式是如何实现的？对数组的特殊处理是如何实现的？是否可以自己实现一个简单的响应式

d. Vue组件的通信方式

e. Vue的指令是如何实现的？

f. Vue的diff算法如何实现？时间复杂度？

g. Vue的nextTick发生了什么？

h. Vue是如何编译模板的？
从零开始写一个小框架。这是一条自底向上的道路，你可以试着从零开始实现一个小的Vue，包含解析模板，生成响应式watcher，生命周期，diff算法，patch dom等等，麻雀虽小五脏俱全，实现完这个小Vue，你对它的理解会更深。

学习要点：一定要多动手，多问为什么

最后回答第三个问题，拿到一个项目的时候如何去阅读和理解，对于这个问题，我觉得有以下几个要点：

第一点，找到相关的文档和人，业务逻辑和技术设计，看相关文档和问人是最快的，照着代码反推是很难受的。

第二点，加断点去调试，这是一个从细节推全貌的过程，只有加了断点，才能知道具体的代码逻辑流转。

如果你把项目的逻辑理清了，也请你写一个新手文档，方便后面维护的人。