目录

学习最难的两点，第一是接收信息，第二是归纳信息。现在是信息爆炸的时代，一个知识点，网络上有无数的blog，论坛，问答，也有无数相关的书本。学会甄别有效信息是很重要的一点。而有效信息的数量其实也很庞大，而且这些信息的呈现大多数并不适合自己，这时候就需要学会归纳和整理。运用以上两点，形成自己的知识体系。这其中，记录blog是一项很重要的手段。在写blog的过程中，你不仅能深刻的理解相关的知识点，构建自己的知识体系。同时也形成了一条条索引，方便随时查阅和复习。

我在写blog的过程中，习惯用织网的方法去记录和学习。将一个个知识点按深度连成一条条线，按广度连成一条条线。然后这些线交织成一张大网，遇到问题就能一网打尽。当然，目前这张网织的还很基础，但是起码有了自己的脉络和方向。而学习的过程，更需要坚持，每天都要有正在进行的项目和代办项。踩好脚下的路，看清眼前的路。

1. 前端系列

作为一个前端程序员，前端知识当然是必备的。这其中各种基础和原理尤其重要，如果不懂这些，就变成了不断去学会使用一个个新的框架和工具，到了一定程度，就很难有进步。

1.1 JS系列

不用说，重中之重。

1.1.1 JS入门难点解析

已完结，共13篇，虽说题目是“入门难点解析”，但是难度却不是“入门”，该系列深入地剖析了JS的各个概念与原理，看完以后你将会换一种方式去思考JS。

我认为JS的难点主要是把握如下几个概念，作用域，作用域链，原型，原型链，继承，活动对象，this，执行环境，变量声明，函数声明。搞清楚这些概念的定义与他们之间的关系，也就不难理解那些看似复杂的JS代码了。

1.1.2 JS原生引用类型解析

完善中，目前共完成7篇。完整列举了JS中常用的原生引用类型的使用方法和属性，掌握这部分知识，有助于我们写出更加优雅更高性能的代码。

我认为这一系列非常有必要去熟悉，JS入门难点系列主要讨论的是原理知识，而本系列着重介绍这些原生引用类型的使用方法和属性。这两者配合在一起，真的是无往不利。当你遇到一些优秀效果实现或者学习他人的代码时，联系这两个系列所学的知识，你会发现代码的逻辑会很清晰，而且他们往往并没有看上去那么好。掌握这两个系列，就可以带着敬畏的心情，批判的态度去学习那些优秀的代码实现啦(?)。

1.1.3 ES6常用新特性学习

完善中，目前共完成4篇。这部分应该算是JS入门难点解析系列在新规范下的补充。

主要是分析了自己平时使用的较多的特性。这部分知识很有必要去学习，但是开始学习阶段没必要求全，先大概了解一下新增的特性范围，然后根据需要去深入研究一下常用的特性。当然有些特性比如Promise和一些内置对象的新特性在JS原生引用类型解析中已经讲过，另外比如模板语法这种比较简单实用的特性也没有做介绍。

1.1.4 JS进阶系列

完善中，目前共完成3篇。我们常说JS是一门面向对象的弱类型和动态类型语言。这个系列，我们分为三部分，第一部分讲解JS的弱类型和动态类型是指什么，第二部分分析JS面向对象的三大特征，第三部分我们一起探讨一下JS语言在使用时应当遵循的设计原则。

1.1.5 JS常用设计模式解析

完善中，目前共完成2篇。随着编程经验的增加，维护更大更复杂的代码模块，需要的就不仅仅只是代码功能性的实现，还需要关注代码的复用性，扩展性和可维护性。这个时候就需要用到设计模式。

1.1.6 JS待整理

完善中，目前共完成2篇。一些散落的知识点，等待串成线。

1.2. CSS系列

虽然现在很多大公司划分了重构，一些前端可能专注于JS逻辑的编写了。但是不懂JS，又怎么去操作CSS呢？（不过，这一块也正是我目前的弱项，正在积极学习实践中）

1.2.1 CSS入门

已完结，共13篇。CSS的入门知识，很全面，由浅入深。适合新手入门。

在这个系列，我通过大量生动形象的例子帮助理解和记忆，让CSS理论学习变得生动自然。当然，这里面很多知识只是其表象，要想深入理解，还需要阅读

CSS进阶系列。

1.2.2 CSS进阶

完善中 ，目前共完成12篇。CSS的进阶知识，扎根文档，全面解析CSS的规则和设计思路。

怎么说呢，这个系列的内容我其实是不满意的，因为公司有对应的重构，所以CSS知识相对比较薄弱。在写这个系列的时候，就缺乏生动形象的的demo，也局限了根据经验去发散思考的能力。主要是扎根文档，甚至很多时候基本是在翻译文档。不过收获其实也是很大的，CSS和JS不一样，它其实侧重的就是规则的运用，所以归根结底在于两点：1. 深刻理解规范 2. 熟练灵活地运用规范。

先说第1点，深刻理解规范，这点我在查找资料的时候，真是深有体会。网上很多资料并不是最新的，基于CSS各个版本。另外，那些中文资料，很多惨不忍睹。而且不少错误的内容大家都不去验证，抄来抄去。所以，如果要查阅文档，请一定一定看W3C英文原版，尝试自己去解读文档。开始培养自己看英文文档和英文文章的习惯，算是写这个系列最大的收获了。至于第2点，无需多言，而且也正好是我目前的短板。

这个系列到这里我会暂停。我准备写CSS第三个系列，主题是关于布局实践。等到知识积累足够，我会回头重新梳理这个系列。（其实这也是一种学习方式，理论联系实践，理论卡壳，就去实践，实践有疑问，就夯实基础。不要割离理论与实践，要交叉并进）

1.2.3 CSS常用布局实现

完善中，已完成5篇。该系列用于整理记录常用的CSS布局实现。

1.2.4 CSS常用效果实现

规划中

1.2.5 知名网站代码分析

规划中

2. 后端

接触后端其实是从自己尝试组织一个前端框架开始，只是浅显的使用了一些模块加载，和使用express的方法。但是后来慢慢意识到，要想独立完成或者合理地把控一个项目，后端的知识必须是要掌握的。目前主要是学习node。

2.1 Node

即将开始。学习了Node的基础知识，看过一些大牛的视屏教程，也做完了NodeSchool的题目。目前正在酝酿第一个系列的文章，着重于node各个模块的讲解。

3. 浏览器

完善中，目前已完成1篇。其实和JS，CSS有些交叉。因为主要想研究的是BOM和兼容性，还有浏览器渲染的原理以及一些特性。希望最终能涉及到内核。

4. 网络

完善中，目前已完成1篇。相当重要的一块，主要是一些协议的知识，一些请求，缓存，跨域的知识。

5. Native

以前有过Android的知识，不过真的快忘了，希望能捡起来。不过人的精力毕竟有限，所以这里的Native主要是说的JS Bridge。有研究过一点PhoneGap，不过只是为了使用，很快就忘了。这一块必须要实践和记录。

6. 性能优化

即将开始。这是一个有追求的程序员必须了解的东西了，这一块在着重了解和实践，还没有记录下来，接下来会开始该系列文章整理。

7. 工具

7.1 模块打包工具

7.1.1 webpack

最流行的模块打包构建工具了，学过该系列知识，了解其原理和优点，也进行了一些实践。webpack的灵魂在于其丰富的插件，插件越多，功能越强大。正在准备着手写该系列文章。

7.1.2 gulp

目前了解不多，准备学习一下。

7.1.3 grunt

了解不多。

7.2 代码管理工具

7.2.1 git

完善中，目前共完成1篇。自己用的最多的代码管理工具了，习惯命令行。但是很多操作和问题还没有记录。会逐步记录

7.2.2 svn

以前使用过，但主要是用GUI。

7.3 调试工具

7.3.1 chrome开发者工具

用的最多的工具了，但其实性能分析这一块有待深入了解和学习。

7.3.2 charles

抓包工具。

8. 算法

这一块没有放到JS里面，而是单独罗列出来。因为算法最重要的是思想，语言只是实现这种思想的载体而已。这块的东西，以前学的时候还不错，现在工作当中用到的地方很少，都快忘光了。最近零星在看，准备抽时间系统学习以下，沉淀下来。

9. 源码学习

选取有代表性的前端框架，进行源码的学习。目前规划两个系列：underscore和vue。

10. 实践

最终我们的学习要落到实处。所以准备选取一些有代表性的项目，由浅入深，系统地分析它们的搭建和优化过程。主要是梳理不同种类的项目开发流程，理解这期间框架为我们做了什么，以及为何会这么做，熟悉一些使用的插件和工具，能够独立完整快速地完成不同类型的项目开发。目前规划有如下五个项目：一个在线商城（在做），一个后管平台（以前做过一部分），一个报表系统（在做），一个微信公众号+聊天室（已上线，由于是商业版本，不方便演示，我会从不同的角度重新全栈开发一个全新的），一个小程序（还没有接触）。

10.1 在线商城项目-six淘

完善中，目前共完成17篇。

一个spa网站，前端使用webpack + vue全家桶，后端使用node + express + mongodb + mongoose，服务器使用阿里云。主要目的不是为了搭建这个项目，而是用这个项目帮助自己贯穿知识点。

作为这个系列的第一部呢，我不打算直接拿一个完整的最终形态的项目出来，一行行去研读，这个工作应该是阅读其他人源码进行学习时进行的。我的想法是，用迭代的方法逐步实现一个项目。一开始，我们前后端分离，使用mock数据进行开发，学习如何在脱离后端的情况下完成前端基本功能开发，并且这个过程也是由浅入深的，逐步去理解框架封装了什么，一些常用插件的功能和为什么要使用这些插件，如何实现路由，请求，数据mock，登录等基本功能。这个过程中，我们逐步深入，慢慢优化，力求每一步都清晰简明，有迹可寻。然后，我们开发后端，学习后端的知识，包括mongodb的使用，将前后端贯通。下一步，我们将代码部署到远程服务器，学习服务器的使用和代码的部署流程。这所有的过程都不是一气呵成，而是循序渐进的，中间可能会阶段性地修改甚至推翻之前的代码。所以我会在github上进行版本管理，方便查阅每一阶段的代码效果。by the way，随着学习的深入和知识的沉淀以及技术的发展。这些东西可能会有不好或者错误的地方，重要的是和大家一起感受一下代码演进的过程，行程分析问题的思想。而且确实能力有限，若有错误，请大家不吝赐教。

11. 前端干货

学习就是不断地汲取营养，多关注一些有营养的公众号和blog。学习并且记录他们的干货文章。

12. 前端新技术

前端技术日新月异，更迭快速。可能你一项技术你还没有掌握，就有新技术取代了它。保持对前沿技术的敏感性，才不会被淘汰。

我的博客即将搬运同步至腾讯云+社区，邀请大家一同入驻：https://cloud.tencent.com/developer/support-plan?invite_code=3zno14zkz5ho