夜听风雨知花落

冒泡排序的基本思想是：每次比较两个相邻的元素，如果它们的顺序错误（例如，从大到小）就把它们交换过来。

在解读 vue 的 diff 算法的同时，我已将 diff 功能集成到了以前写项目之中。且这个项目还实现了数据劫持、模版编译和数据响应以及指令绑定，感兴趣的同学可以下载调试一下。

核心代码的展示，不仅是为了向大家说明 vue 响应式基本原理实现的关键步骤，更是为了方便大家调试源码。感兴趣的小伙们，可以下载本例 demo 进行调试，毕竟实践出真知。

本文所列封装组件的步骤，是以 Element UI 的回到顶部组件为例，但不完全局限于它（至少可以做个参考）。所展示的 demo 也做出了一点修改。

本篇文章代码是在 vue 模版编译 和 vue 数据劫持的基础上实现的。主要对实现指令的核心功能函数和它们是如何调用的进行了介绍，因此建议感兴趣的小伙伴们下载 demo，边看注释边调试。

在之前的一篇this 的四种绑定规则文章中，我们已经了解了 this 的四种绑定规则。但，那都是在调用位置处只应用一条规则的情况下进行说明的。而本篇文章，则是主要介绍，当调用位置处应用多条规则时

this 是函数运行时，在函数体内部自动生成的一个对象，只能在函数体内部使用。且在不同场合使用的函数，其 this 的值也不同。总的来说，this 就是函数运行时所在的环境对象。

最近在开发H5时又再次遇到了需要对图片等比缩放的需求。想着这也是自己以前刚开始工作时遇到困难之一，因此就记录了一下。希望能对有需要的小伙伴有所帮助吧。

当函数可以记住并访问所在的词法作用域时，就产生了闭包，即使函数是在当前词法作用域之外执行。按照《JavaScript 高级程序设计》书中所说：闭包是指有权访问另一个函数作用域中的变量的函数。