前言

时至今日,Vue.js就像曾经的jQuery,已经成为前端工程师必备的技能。不可否认,它可以极大地提高我们的开发效率,并且很容易学习。

这就造成了一个很普遍的现象,大部分前端工程师对框架以及第三方周边插件的关注程度越来越高,甚至把自己全部的关注点都放在了框架上。

在我看来,这多少有点亚健康,不是很利于前端工程师的技术成长。因为我发现大家关注框架时,更多的是关注其用法(包括框架自身、第三方插件和UI组件库等)、奇淫技巧和最佳实践等。

而我希望大家拿出一部分精力去关注框架所解决的问题以及它是如何解决这些问题的。这有助于我们提升自己的技术和解决问题的能力。

大家在使用Vue.js开发项目时,不免总会遇到一些奇奇怪怪的问题,而我们是否能很快解决这些问题以及理解这些问题为什么会发生,主要取决于对Vue.js原理的理解是否足够深入。

本书目的

所有技术解决方案的终极目标都是在解决问题,都是先有问题,然后有解决方案。解决方案可能并不完美,也可能有很多种。

Vue.js也是如此,它解决了什么问题?如何解决的?解决问题的同时都做了哪些权衡和取舍?

本书将带领大家透过现象看到Vue.js的本质,通过本书,我们将学会:

 Vue.js的响应式原理,理解为什么修改数据视图会自动更新;

 虚拟DOM(Virtual DOM)的概念和原理;

 模板编译原理,理解Vue.js的模板是如何生效的;

 Vue.js整体架构设计与项目结构;

 深入理解Vue.js的生命周期,不同的生命周期钩子之间有什么区别,不同的生命周期之间Vue.js内部到底发生了什么;

 Vue.js提供的各种API的内部实现原理;

 指令的实现原理;

 过滤器的实现原理;

 使用Vue.js开发项目的最佳实践。

组织结构

本书共分四篇,全方位讲解了Vue.js的内部原理。

 第一篇:共3章,详细讲解了Vue.js内部核心技术“变化侦测”,并一步一步带领大家从0到1实现一个简单的“变化侦测”系统。

 第二篇:共3章,详细介绍了虚拟DOM技术,其中包括虚拟DOM的原理及其patching算法。

 第三篇:共4章,详细介绍了模板编译技术,其中包括模板解析器的实现原理、优化器的原理以及代码生成器的原理。

 第四篇:这是本书占比最大的一部分,详细介绍了Vue.js的整体架构以及提供给我们使用的各种API的内部原理。同时还对Vue.js的生命周期、错误处理、指令系统与模板过滤器等功能的原理进行了介绍。在本书最后一章,我们为大家提供了一些使用Vue.js开发项目的最佳实践,这些内容中一大部分是Vue.js官网提供的,还有一小部分是我自己总结的。

在撰写本书时,Vue.js的最新版本是2.5.2,所以本书中的代码参考该版本进行撰写。如果你想对照源码来阅读本书,可以在GitHub上找出该版本的源码。此外,关于本书的任何意见和建议,都可以在这里讨论:https://github.com/berwin/Blog/issues/34。关于本书的微信群,也请参见这个页面。

致谢

这本书的诞生我要感谢很多人。我曾幻想过如果有一天自己能出版一本技术书,那该有多好,但从来没有想到这一天来得这么快,我更想象不到这一天会在我23岁时发生。在我看来,这件事不可能发生在我的身上,但它确确实实发生了。

这一切都要感谢王军花老师,是她给了我这个机会。最初她找到我,问我有没有兴趣写一本深入介绍Vue.js的书时,我的内心很挣扎。因为这可以实现我的一个梦想,但我又担心自己写不好,觉得自己不够资格出版一本书。最终经过激烈的思想斗争后,我决定接受这个挑战,做一些让自己佩服自己的事。

不止是感谢军花老师给我这个机会,我还非常感谢她前前后后跟进这本书,包括书的进度以及与我一起审校和修改这本书等很多事情,非常感谢!

其次我要感谢我的领导LC(梁超)和肆爷(何烁),当他们听说我要写一本书时,给了我很大的帮助和支持。本书没有拖稿,我按时写完了所有章节,这一切都是源于他们对我的大力支持。如果没有他们,我想我也没有办法按时交稿,非常感谢!

同时我也非常感谢李松峰老师,在开始写这本书时,李老师给我讲了很多写作方面的技巧,并且教我怎样写一本好书,怎么写出阅读体验良好的书。并且在这本书写完之后,李老师还答应给这本书写序,真的非常感谢!

我更要感谢我的父母,感谢你们对我多年的养育之恩,辛辛苦苦把我养大。如今,我虽有了一份稳定的工作,但回家的次数却越来越少。我很愧疚不能在你们身边工作,不能经常陪在你们身边。现在,我出版了一本书,不知道你们会不会为我感到骄傲。

我还要感谢堂姐王砚天,在写作期间给了我很多精神鼓励与支持,并且给我买了很多好吃的。

除此之外,我要感谢第一批内测读者(刘冰晶、姚向阳、周延博、王建兵、陈凤),感谢你们的阅读以及给我提供的宝贵修改意见,非常感谢!

最后,我要感谢正在阅读这部分的你,感谢你阅读本书,感谢你对我的支持,谢谢!

目录

  • 序一
  • 序二
  • 前言
  • 第1章 Vue.js简介
  • 第一篇 变化侦测
  • 第2章 Object的变化侦测
  • 第3章 Array的变化侦测
  • 第4章 变化侦测相关的API实现原理
  • 第二篇 虚拟DOM
  • 第5章 虚拟DOM简介
  • 第6章 VNode
  • 第7章 patch
  • 第三篇 模板编译原理
  • 第8章 模板编译
  • 第9章 解析器
  • 第10章 优化器
  • 第11章 代码生成器
  • 第四篇 整体流程
  • 第12章 架构设计与项目结构
  • 第13章 实例方法与全局API的实现原理
  • 第14章 生命周期
  • 第15章 指令的奥秘
  • 第16章 过滤器的奥秘