重学前端－跟着小冬老师学前端

在这个专栏里，我将知识分成了四个模块来讲解：

  • JavaScript；

  • CSS 和 HTML；

  • 浏览器实践；

  • 前端综合应用。

前三个模块是前端的基础知识，是个人的前端能力提升，而模块四则是前端团队发展相关的内容，有助于你和团队的整体提高。

在JavaScript 部分中，我主要会从文法和运行时的角度去讨论 JavaScript 语言。它们是互相关联的，而语义就是文法到运行时之间的桥梁；它们分别又是完备的，任何语言特性都离不开两者，所以从语法和运行时的角度，我们都可以了解完整的 JavaScript。

CSS 和 HTML 部分，会侧重从语言和设计思想的角度来讲解，我们同样可以对两者的全貌建立一些认知。

浏览器部分，包含了浏览器工作的原理和一些重要的 API，包括 BOM、DOM、CSSOM 和其他一些内容。了解了这些知识，你才能把 JavaScript 和 HTML、CSS 连接起来，用 JavaScript 来实现功能。

前端综合应用部分，主要是我的一些工作经验，我会选择我在手淘和淘宝工作中的一些案例来辅助讲解。

前面，我说到前端是一个非常年轻的职业，但我仍然认为前端具有很多空间和机会，一些基础设施仍然简陋，前端的能力可以带来更多的业务场景，这些有待于我们去发掘。

前端社区非常活跃，新技术也在不断出现。在这样的环境下，机会和竞争并存，学习也犹如逆水行舟，不进则退，建立自己的知识体系和方法论，你才能够保持领先优势。

我希望从我的经验出发，给你一些启发和帮助，并借由这个专栏帮你建立自己的前端知识体系。同时，我也相信，在你们中间一定会产生更多能够带领前端领域取得突破的、优秀的前端工程师。

目录：

01-明确你的前端学习路线与方法

02-列一份前端知识架构图

03-HTML语义：div和span不是够用了吗？

04-HTML语义：如何运用语义类标签来呈现Wiki网页？

05-JavaScript类型：关于类型，有哪些你不知道的细节？

06-JavaScript对象：面向对象还是基于对象？

07-JavaScript对象：我们真的需要模拟类吗？

08-JavaScript对象：你知道全部的对象分类吗？

09-CSS语法：除了属性和选择器，你还需要知道这些带@的规则

10-浏览器：一个浏览器是如何工作的？（阶段一）

11-浏览器：一个浏览器是如何工作的？（阶段二）

12-浏览器：一个浏览器是如何工作的（阶段三）

13-浏览器：一个浏览器是如何工作的？（阶段四）

14-浏览器：一个浏览器是如何工作的？（阶段五）

15-HTML元信息类标签：你知道head里一共能写哪几种标签吗？

16-JavaScript执行（一）：Promise里的代码为什么比setTimeout先执行？

17-JavaScript执行（二）：闭包和执行上下文到底是怎么回事？

18-JavaScript执行（三）：你知道现在有多少种函数吗？

19-JavaScript执行（四）：try里面放return，finally还会执行吗？

20-CSS选择器：如何选中svg里的a元素？

21-CSS选择器：伪元素是怎么回事儿？

22-浏览器DOM：你知道HTML的节点有哪几种吗？

23-HTML链接：除了a标签，还有哪些标签叫链接？

24-CSS排版：从毕升开始，我们就开始用正常流了

25-浏览器CSSOM：如何获取一个元素的准确位置

26-JavaScript词法：为什么12.toString会报错？

27-（小实验）理解编译原理：一个四则运算的解释器

28-JavaScript语法（预备篇）：到底要不要写分号呢？

29-JavaScript语法（一）：在script标签写export为什么会抛错？

30-JavaScript语法（二）：你知道哪些JavaScript语句？

31-JavaScript语法（三）：什么是表达式语句？

32-JavaScript语法（四）：新加入的--运算符，哪里有些不一样呢？

33-HTML替换型元素：为什么link一个CSS要用href，而引入js要用src呢？

34-HTML小实验：用代码分析HTML标准

35-CSSFlex排版：为什么垂直居中这么难？

36-浏览器事件：为什么会有捕获过程和冒泡过程？

37-浏览器API（小实验）：动手整理全部API

38-CSS动画与交互：为什么动画要用贝塞尔曲线这么奇怪的东西？

39-HTML语言：DTD到底是什么？

40-CSS渲染：CSS是如何绘制颜色的？

41-CSS小实验：动手做，用代码挖掘CSS属性

42-HTML·ARIA：可访问性是只给盲人用的特性么？

43-性能：前端的性能到底对业务数据有多大的影响？

44-工具链：什么样的工具链才能提升团队效率？

45-持续集成：几十个前端一起工作，如何保证工作质量？

46-搭建系统：大量的低价值需求应该如何应对？

47-前端架构：前端架构有哪些核心问题？

答疑加餐-学了这么多前端的“小众”知识，到底对我有什么帮助？

加餐-前端交互基础设施的建设

加餐-前端与图形学

简介

开篇词-从今天起，重新理解前端

期末答疑（二）：前端架构中，每个逻辑页面如何可以做到独立发布呢？

期末答疑：前端代码单元测试怎么做？

期中答疑-name(){}与name-function(){}，两种写法有什么区别吗？

尾声-长风破浪会有时，直挂云帆济沧海

新年彩蛋-2019，有哪些前端技术值得关注？

用户故事-那些你与“重学前端”的不解之缘