-
常见的异步操作:
1、定时器setTimeout
2、postmessage
3、WebWorker
4、CSS3 动画
5、XMLHttpRequest
6、HTML5的本地数据读写JS是单线程语言:
1、就简单性而言,把每一件事情(包括GUI事件和渲染)都放在一个线程里来处理是一个很好的程序模型,因为这样就无需再考虑线程同步这些复杂问题
2、另一方面,他也暴露了应用开发中的一个严重问题,单线程环境看起来对用户请求响应迅速,但是当线程忙于处理其它事情时,就不能对用户的鼠标点击和键盘操作做出响应
Deferreds:Deferreds 的引入对这个问题提供了一个更好的解决方案,它是非阻塞的,并且与代码完全解耦
查看全部 -
静态接口设计:
静态方法是直接操作数据类的 data_user.access 方法。将数据存放在全局缓存(我们称之为“globalCache”)中,即 “globalCache” 包含了多个 DOM Element 的 “cache”,并在 DOM Element 上添加一个属性,存放 “cache” 对应的 uid
$.data() 与 $.fn.data() 的区别:一个对应jQuery对象,一个对应DOM元素
1:jQuery.data(element,[key],[value]),每一个element都会有自己的一个{key:value}对象保存着数据,所以新建的对象就算有key相同它也不会覆盖原来存在的对象key所对应的value,因为新对象保存是是在另一个{key:value}对象中
2:$("div").data("a","aaaa") 它是把数据绑定每一个匹配div节点的元素上
说到底,数据缓存就是在目标对象与缓存体间建立一对一的关系,整个Data类其实都是围绕着 thia.cache 内部的数据做增删改查的操作
查看全部 -
jQuery.access:
jQuery的方法设计大都是多用的,可以根据传递参数的个数判断是set还是get处理,不仅如此jQuery还对参数的传递类型还抽出了一个处理的方法jQuery.access,我们可以传递字符串、数组、对象等等,根据这种类型自动分解成接口所有能接受的参数
查看全部 -
Data类的设计:
1、先在jQuery内部创建一个cache对象{}, 来保存缓存数据。 然后往需要进行缓存的DOM节点上扩展一个值为expando的属性
2、接着把每个节点的dom[expando]的值都设为一个自增的变量id,保持全局唯一性。 这个id的值就作为cache的key用来关联DOM节点和数据。也就是说cache[id]就取到了这个节点上的所有缓存
3、每个uid对应一个elem缓存数据,每个缓存对象是可以由多个name value(名值对)对组成的,而value是可以是任何数据类型的
注:expando的值,用于把当前数据缓存的UUID值做一个节点的属性给写入到指定的元素上形成关联桥梁,所以,所以元素本身具有这种属性的可能性很少,所以可以忽略冲突。
查看全部 -
jQuery缓存的设计思路:
数据存放在内存中,通过一个映射关系与直接的DOM元素发生关联
数据缓存,jQuery现在支持两种:
1. dom元素,数据存储在jQuery.cache中。
2. 普通js对象,数据存储在该对象中。数据缓存的特点:
1、如果是DOM元素,通过分配一个唯一的关联id把DOM元素和该DOM元素的数据缓存对象关联起来,关联id被附加到以jQuery.expando的值命名的属性上,数据存储在全局缓存对象jQuery.cache中。在读取、设置、移除数据时,将通过关联id从全局缓存对象jQuery.cache中找到关联的数据缓存对象,然后在数据缓存对象上执行读取、设置、移除操作。
2、如果是Javascript对象,数据则直接存储在该Javascript对象的属性jQuery.expando上。在读取、设置、移除数据时,实际上是对Javascript对象的数据缓存对象执行读取、设置、移除操作。
3、为了避免jQuery内部使用的数据和用户自定义的数据发生冲突,数据缓存模块把内部数据存储在数据缓存对象上,把自定义数据存储在数据缓存对象的属性data上。
查看全部 -
缓存处理的静态与实例方法的区别:
1.jQuery.data()可以实现为dom元素或js对象添加缓存
2.$("ele").data()实是对前者的扩展,其目的是可以方便的通过选择器为多个dom元素添加缓存数据查看全部 -
把很多属性,比如状态标志都写到dom节点中,也就是HTMLElement。
好处:直观,便捷
坏处:
1、循环引用
2、直接暴露数据,安全性?
3、增加一堆的自定义属性标签,对浏览器来说是没意的
4、取数据的时候要对HTML节点做操作jQuery缓存系统的的好处:
A.允许我们在DOM元素上附加任意类型的数据,避免了循环引用的内存泄漏风险
B.用于存储跟dom节点相关的数据,包括事件,动画等
C.一种低耦合的方式让DOM和缓存数据能够联系起来jQuery缓存系统的真正魅力在于其内部应用中,动画、事件等都有用到这个缓存系统。试想如果动画的队列都存储到各DOM元素的自定义属性中,这样虽然可以方便的访问队列数据,但也同时带来了隐患。如果给DOM元素添加自定义的属性和过多的数据可能会引起内存泄漏,所以要尽量避免这么干。
对于jQuery来说,数据缓存系统本来就是为事件系统服务而分化出来的,到后来,它的事件克隆乃至后来的动画列队实现数据的存储都是离不开缓存系统,所以数据缓存也算是jQuery的一个核心基础了
$.data(element, key, value )
$(elem).data(key, value)查看全部 -
内存泄露是指一块被分配的内存既不能使用,又不能回收,直到浏览器进程结束。
常见内存泄露的几种情况:
1、循环引用
2、Javascript闭包
3、DOM插入
其实绝大部分内存泄漏都不是由Javascript引起的,浏览器的回收机制已经做的相当好了,多数的泄漏都是由于与DOM交互而产生的。
循环引用很常见且大部分情况下是无害的,但当参与循环引用的对象中有DOM对象或者ActiveX对象时,循环引用将导致内存泄露。
由于DOM元素(节点)也是对象, 所以我们可以直接扩展DOM元素的属性,但是如果给DOM元素添加自定义的属性和过多的数据可能会引起内存泄漏,所以应该要尽量避免这样做。
查看全部 -
stopOnFalse: 当一个回调返回false 时中断调用
jQuery.Callbacks("once memory")的组合了,无非就是组合起来的时候要考虑一些判断了
查看全部 -
Unique:确保一次只能添加一个回调(所以在列表中没有重复的回调)
过滤重复的比较简单,因为是数组的保存方式,我们可以在入口处通过indexOf判断即可
查看全部 -
memory:保持以前的值,将添加到这个列表的后面的最新的值立即执行调用任何回调 (像一个递延 Deferred)。
结果可以看出,我们在执行cbs.add(fn2);的时候,此时除了把fn2添加到了回调队列之外而且还立刻执行了这个方法,唯一的区别就是,参数是用的之前的。所以解释就叫“保持以前的值”。
私有变量memory缓存这上一个参数的属性,我们靠firingStart用来定位最后通过add增加的回调数据的索引。在遍历的时候直接通过firingStart的起始索引定位,然后传递memory的参数,而且实现这种“保持以前的值”的设计
查看全部 -
once定义是很明确的,确保这个回调列表只执行( .fire() )一次(像一个递延 Deferred)
查看全部 -
通过学习了观察者模式的思路,我们知道callback需要在内部维护着一个list的队列数组,用于保存订阅的对象数据。同时也需要提供了add、remove、fire等订阅、发布、删除类似的接口
查看全部 -
jQuery回调对象
jQuery.Callbacks一般开发者接触的很少,虽然jQuery向开发者提供了外部接口调用,但是$.Callbacks()模块的开发目的是为了给内部$.ajax() 和 $.Deferred()模块提供统一的基本功能组件。它可以用来作为类似基础定义的新组件的功能。
jQuery.Callbacks还提供“once memory”等参数用来处理:
1、once: 确保这个回调列表只执行( .fire() )一次(像一个递延 Deferred)。
2、memory: 保持以前的值,将添加到这个列表的后面的最新的值立即执行调用任何回调 (像一个递延 Deferred)。
3、unique: 确保一次只能添加一个回调(所以在列表中没有重复的回调)。
4、stopOnFalse: 当一个回调返回false 时中断调用。
查看全部 -
观察者模式的实际应用:
设计该模式背后的主要动力是促进形成松散耦合。
观察者模式所做的工作就是在解耦,让耦合的双方都依赖于抽象,而不是依赖于具体。从而使得各自的变化都不会影响到另一边的变化。
查看全部
举报