深入理解AngularJs-scope的脏检查(一)-创新互联
进入正文前的说明:本文中的示例代码并非AngularJs源码,而是来自书籍<
在这篇文章中,希望能让您理清楚以下几项与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://hbruida.cn/article/djpjsd.html