前言

先不谈具体的学习内容，我准备通过自己在前端方面的学习成长历程，并结合几年的工作经验来谈谈对前端学习的想法。以下都是笔者的愚见，请大家保持平常心看待。

在前端技术日新月异的今天，正在从事前端开发或者想要从事前端开发的读者都会有一个疑惑：前端发展的速度太快了，该怎么去学？

前端发展的速度有多快？我们仔细想一下。

在JavaScript方面，正当我们沉浸在ES 2015（ES6）带来的一系列好处，并开始学习它时，ES 2019已经登场了。ES的版本正在以每年迭代一次的速度更新，我们都会感慨，这更新的速度也太快了吧！

就HTML来说，HTML5的诞生为页面交互处理、多媒体实现提供了极大的便利，它也成了Web端未来的发展趋势。但是回过头来，谁又能想到，曾经的霸主Flash已然被人们抛弃，在移动互联网的时代，后浪终究会将前浪拍在沙滩上。

就CSS来说，CSS3较之前的版本增加了很多强大的属性，包括页面布局、变换、动画，丰富了页面的呈现形式。可能还没等我们系统学习完，又有一些新特性出现，我们也许同样会感慨，这更新的速度也太快了吧！

就框架或者类库来说，曾经风靡一时的jQuery逐渐被人抛弃，众人转向更加符合时代需求的MVVM框架。

在MVVM时代，Angular、Vue、React“三驾马车”并驾齐驱。Vue自2016年完成2.0版本升级后便火得一发不可收拾，在GitHub上的star数径直超过React。在我们犹豫该好好学哪个框架时，Vue已经完成了3.0版本的升级，我们会再次感慨，这更新的速度也太快了吧！

也许gulp、webpack等项目构建工具，大家还没开始学习，它就已经更新到4.0甚至更高的版本。

对于前端开发，Node.js也是一项必须掌握的语言，其包括了基本的npm、http、文件读写等操作。可能还没等大家投入精力学习时，它已经发布10.X的版本了，我们不得不再次感慨，这更新的速度也太快了吧！

除了上面提到的这些，还有很多需要学习的内容，它们都在以极快的速度更新着，可能哪一天业界又火了一个新的框架，而没准哪个框架又成为历史了。

以上的种种，最终还是会归结成一个问题，应该怎么去学习前端？

我觉得最重要的是打牢基础，善于思考，提高解决问题的能力。

而唯一真正要做的就是多敲代码！多敲代码！多敲代码！——重要的事情说3遍。

前端的学习相比后端有个便利的地方：我们可以通过控制台，或者通过HTML源码等，借助浏览器很快地验证自己的观点，没有后端部署、启动server等复杂的过程。

那么，该如何快速地学习JavaScript呢？

供参考的JavaScript学习路线

基于本书内容的整理，我将从以下几个阶段提供一个供参考的JavaScript学习路线。

1. 基础篇

JavaScript是前端学习的重中之重，对原生的JavaScript的掌握程度将决定后面对框架学习的理解程度。

在学习完JavaScript基础篇之后，应该掌握以下知识点。

· 数据类型。

· 表达式。

· 循环结构。

· 内置对象的常用方法。

· 函数基础。

· DOM相关操作、事件。

当大家学习完基础内容后，可以动手编写一个网页，以检验自己的学习成果。

2. 核心篇

核心篇作为基础篇的深入，是必须掌握的内容，这部分的学习成果将决定后续学习的高度。

JavaScript核心篇主要包括以下学习内容。

· 原型、原型链。

· 作用域。

· 闭包。

· this。

· 继承。

· Ajax。

· ES6。

当大家学习完核心篇内容后，可以多练习一些JavaScript的经典作用域、闭包、继承等内容，并且还可以尝试封装一个属于自己的辅助类。

3. 模块化以及组件化

前端开发已经从原来的整体化开发发展到现在的模块化开发，甚至是组件化开发，开发过程愈发精细，讲求的是代码的可复用性。

以前开发一个页面是从上到下一次编写的过程，现在已经发展为先将页面拆分成模块甚至是组件，不同的人关注不同的模块、组件，以提高开发效率。

JavaScript模块化开发的标准是由CommonJS规定的。基于这个标准，诞生了不同的实现方式，分别是AMD规范和CMD规范。

基于AMD规范的产物是RequireJS，基于CMD规范的产物是SeaJS，读者可以根据实际需要做具体选择。

在学习完模块化知识后，应该掌握以下知识点。

· AMD规范和CMD规范的差异。

· RequireJS和SeaJS的使用方式。

本书结构

本书共有7章，各章简介如下。

第1章 “JavaScript重点概念”，介绍的内容包括JavaScript的基本数据类型、运算符等。

第2章 “引用数据类型”，介绍的内容包括Object类型、Array类型、Date类型及一些常见的算法。

第3章 “函数”，介绍的内容包括函数的定义与调用、函数参数、闭包、this、call()函数、apply()函数、bind()函数等。

第4章 “对象”，介绍的内容包括对象的属性和访问方式、创建、克隆、继承，以及核心的原型对象的概念。

第5章 “DOM与事件”，介绍的内容包括DOM选择器、常用的DOM操作、事件流、Event对象等。

第6章 “Ajax”，介绍的内容包括Ajax的原理及执行过程、Ajax提交Form表单、Ajax跨域解决方案等。

第7章 “ES6”，介绍的内容都是ES6中的新特性，包括let和const关键字、箭头函数、Promise、Class、Module等。

总结

无论学习哪一种语言，都要经历一段漫长的过程，耐心才是最重要的。始终还是那4个字——多敲代码，努力完成每一个想要完成的功能。

在学习的过程中遇到问题是在所难免的，不要害怕遇到问题，记住一点，你所遇到过的任何问题一定是别人遇到过的。所以遇到问题时，一定要学会在网上寻找答案，拒绝做“伸手党”。

大牛之所以能称之为大牛，是因为他们解决问题的能力比别人强，能一眼看出问题的所在，而大家要做的就是朝着这个方向去努力。

周雄

2020.5.30