1.2 明确你的 前端学习路线 和 方法
一 前端现状 和 存在的问题
1. 现状
. 前端越来越重要 越来越复杂 但是没有一个大学开设前端课程 更没有系统性的教学方案
. 大家都是自学基础知识 在工作中实践 和 后续零散的学习.
2. 导致的问题
1. 前端的基础知识的欠缺 会让你束手束脚 更限制你解决问题的思路
2. 技术上存在短板 导致上升通道受阻
特别是小公司的程序员 只能靠自己摸索 很容易陷入重复性劳动陷阱避免，最终耽误自己的职业发展
3. 技术发展带来的挑战
前端社区高度活跃 前端标准快速更新 这样蓬勃的发展对技术来说是好事
副作用也明显 前端的学习压力变得很大
我们就拿JavaScript标准来说 ES6中引入的新特性超过了过去十年的总和 新特性带来的实践就更多了
仅仅是一个 Proxy 特性的引入 就支持了Vue从2.0到3.0的内核原理完全升级.
缺少系统教育 + 技术快速革新 在这样的大环境下 自学能力显的尤为重要
二 学习路径与学习方法
. 零基础的同学
1. 读几本经典的前端教材 《JavaScript高级程序设计》《精通CSS》等
2. 阅读参考性质的网站 如 MDN
. 有一些经验可以学习极客时间的专栏
. 本专栏希望达成的目标
. 带你摸索出适合你的前端学习方法
. 帮助你建立起前端技术的知识架构
. 让你理解前端技术背后的核心思想
方法1）建立知识架构
. 建立自己的知识架构 并且在这个架构上 不断进行优化
. 什么是知识架构
可以理解为知识的目录或索引
它能够帮我们把零散的知识组织起来 也能够帮助我们发现知识上的盲区
. 什么是好的知识架构
. 最重要的就是 逻辑性 和 完备性
. 我们来思考一个问题 给JavaScript知识做一个顶层目录
我们把一些流行的术语拼凑出来 可能是这个样子
[ 类型转换 this指证 闭包 作用域链 原型链 ]
这不是我们想要的结果 因为这些知识点之间 没有任何逻辑关系。
它们既不是并列关系 又不是递进关系 合在一起 没有任何意义。这样的知识架构 无法帮助我们去发现问题和理解问题
----------------------------------------------------------------------------------------------
. JavaScript顶级目录的 正确的做法
1. 文法
2. 语义
3. 进行时
对于任何计算机语言来说 必定是 用规定的文法 去表达特定语义 最终操作运行时的 一个过程
这样划分顶层 JavaScript的任何知识都不会出现在这个范围之外 这是知识架构的完备性
-----------------------------------------------------------------------------------------------
. 再细分一级
1. 文法
. 词法
. 语法
2. 语义
3. 运行时
. 类型
. 执行过程
文法可以分成词法和语法 这来自编译原理的划分 同样是完备的.
语义和语法有一一对应的关系 这里暂不做区分
对于运行时部分 这个划分保持了完备性，我们都知道：程序 = 算法 + 数据结构 那么对运行时来说
类型就是数据结构 执行过程就是算法
我们再往下分 就会看到熟悉的概念
. 词法中有：各种直接量 关键字 运算符
. 语法和语义：表达式 语句 函数 对象 模块
. 数据类型：对象 数字 字符串等
这样逐层向下细分 知识框架就初见端倪了 在顶层和大结构上 我们通过逻辑来保持完备性
如果继续往下分 就需要一些技巧了 我们可以寻找一些线索.
比如: 在JavaScript标准中 有完整的方法定义 它是具有完备性的 所以我们可以根据它来完成
我们还可以根据语法去建立语义的知识架构 实际上JavaScript有一份统一的标准 所以相对来说并不困难.
如果是浏览器中的API 就有些困难了 它们分布在W3C的各种标准中 非常难找.
有用的方法 for in 遍历 window 的属性 再去找内容
学习的过程 实际上就是知识框架不断进化的过程 通过知识框架的自然延伸 我们可以更轻松的记忆一些原本难以记住的点 还可以发现被忽视的知识盲点.
方法2）追本溯源 找到知识的源头
. 有一些知识 背后有一个很大的知识体系
opacity display 虽然都是属性 它们背后的知识量完全不同
opacity 就是非常单纯的数值 表示透明的程度
display 它的每一个取值背后 都是一个不同的布局体系.
我们要讲清楚display 就必须关注 正常流 弹性布局系统 和 grid这些内容
. 追本溯源：
其实就是关注技术提出的背景 关注原始的论文或者作者 关注作者说的话.
