深入理解AngularJs－scope的脏检查（一）-创新互联

进入正文前的说明：本文中的示例代码并非AngularJs源码，而是来自书籍<>, 这本书的作者仅依赖jquery和lodash一步一步构建出AngularJs的各核心模块，对全面理解AngularJs有非常巨大的帮助。若有正在使用AngulaJs攻城拔寨并且希望完全掌握手中武器的小伙伴，相信能对你理解AngularJs带来莫大帮助，感谢作者。

成都创新互联公司拥有十多年成都网站建设工作经验,为各大企业提供成都做网站、网站设计服务，对于网页设计、PC网站建设（电脑版网站建设）、app软件开发公司、wap网站建设（手机版网站建设）、程序开发、网站优化（SEO优化）、微网站、国际域名空间等，凭借多年来在互联网的打拼，我们在互联网网站建设行业积累了很多网站制作、网站设计、网络营销经验，集策划、开发、设计、营销、管理等网站化运作于一体，具备承接各种规模类型的网站建设项目的能力。

在这篇文章中，希望能让您理清楚以下几项与scope相关的功能：

1.dirty-checking(脏检测)核心机制，主要包括：$watch 和 $digest;

2.几种不同的触发$digest循环的方式：$eval, $apply, $evalAsync, $applyAsync;

3.scope的继承机制以及isolated scope；

4.依赖于scope的事件循环：$on, $broadcast, $emit.

现在开始我们的第一部分：scope和dirty-checking

dirty-checking(脏检测)原理简述：scope通过$watch方法向this.$$watchers数组中添加watcher对象(包含watchFn, listenerFn, valueEq, last 四个属性)。每当$digest循环被触发时，它会遍历$$watchers数组，执行watcher中的watchFn，获取当前scope上某属性的值(一个watcher对应scope上一个被监听属性)，然后去同watcher中的last(上一次的值)做比较，若两值不相等，就执行listenerFn。

function Scope() {
  this.$$watchers = []; // 监听器数组
  this.$$lastDirtyWatch = null; // 每次digest循环的最后一个脏的watcher, 用于优化digest循环
  this.$$asyncQueue = []; // scope上的异步队列
  this.$$applyAsyncQueue = []; // scope上的异步apply队列
  this.$$applyAsyncId = null; //异步apply信息
  this.$$postDigestQueue = []; // postDigest执行队列
  this.$$phase = null; // 储存scope上正在做什么,值有：digest/apply/null
  this.$root = this; // rootScope

  this.$$listeners = {}; // 存储包含自定义事件键值对的对象

  this.$$children = []; // 存储当前scope的儿子Scope,以便$digest循环递归
}

另外有需要云服务器可以了解下创新互联建站www.cdcxhl.com，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

本文标题：深入理解AngularJs－scope的脏检查（一）-创新互联
标题路径：http://dzwzjz.com/article/djpjsd.html