【重学前端专栏学习笔记】建立系统的知识架构体系

明确你的前端学习路线

自己特别喜欢屯课，看着自己买的课，有种满足感，仿佛知识都是我的了，翻看极客时间买的课，决定这段时间把重学前端专栏学习一遍。

从周六到今天，一共学习了 5 篇文章，这个专栏的信息量是非常大的，特别是第一章《前端的学习路线与方法》给我的启发特别大。

首先一上来就分享了两个学习方法：建立知识架构、追本溯源。

建立知识架构很够就相当于把知识分类了，输入时有条理的存储，输出时能够快速找出对象的知识点。而追本溯源的学习方法特别适用于一些概念性的东西，可以追溯提出时的背景及之后的演变过程等。

建立知识架构

winter 在文中说：你的知识框架是啥？this、闭包、作用域、原型等术语拼凑起来？这些名词之间有关联吗？

显然这只是在堆砌名词，就算你弄清楚了this是啥，但你始终不知道this为啥为这样。然后每次新技术发布后，在一堆名词中迷失，无从下手。

winter 给出了他的知识框架，他将javascript分成了三个层级：

• 文法

  • 词法
  • 语法
• 语义

• 运行时

  • 类型
  • 执行过程

为什么这么划分，他说：对任何计算机语言来说，必定是“用规定的文法，去表达 特定语义，最终操作运行时”的一个过程

这里有三个名词：文法、语义、运行时。这三个词大部分同学都比较陌生，当然我也是。第一次接触到这些名词，给我挺冲击的，虽然还不明白其中的意义，这里先混个眼熟，下次在出现这些名词，就会有个印象。

追本溯源

追本溯源的方法能够帮我们了解一些看起来不太合理的东西，有时候还能发现一些八卦。

在饥人谷跟着方方学的时候，方方老师每次在讲一个新概念的时候，总是从历史讲起，这些知识虽然看上去没啥用，但是这些知识在你今后的遇到一些不太理解的东西是特别有用，就不会去质疑知识本身了。

列一份前端知识架构图

在这章节中，winter 分享了本专栏要学习的知识架构：javascript、html/css、浏览器的实现原理和API、前端工程实践四个模块。

javascript按照文法、语义、运行时进行讲解，这个符合语言的一般规律：用一定的词法和语法，表达一定语义，从而操作运行时。

按照这个一遍规律在继续往下分，运行时又可以分为：数据结构和执行过程，数据结构和执行过程还能再继续往下分...

文法中的语法和语义是一一对应的关系

html/css和浏览器的实现原理和API知识比较细碎，我这里就不一一列举出来了。

最后一个是前端工程实践，从性能、工具链、持续集成、搭建系统、架构与基础库五个方面讲起。

总结

在结束的时候，winter 留了一个问题：你的知识划分是否和我一样？

我之前的知识体系非常混乱，js、ts、vue、git、webpack、小程序，es6、canvas等知识混为一谈，越学越迷茫，学了这个又想学那个，学了那个这个又放弃了，因为我根本不知道要学啥，只知道这些名词，所见即所得，那都学了吧，而正确的学习方法就应该像 winter 这样的划分知识架构，然后深入去学。