jQuery缓存机制(四)
Data封装的方法的后面四个方法 和 dataAttr方法阅读。
Data.prototype = {
key: function( owner ) {},
set: function( owner, data, value ) {},
get: function( owner, key ) {},
// 该方法集中处理了几种情况。该方法看似没什么用,其实它是暴露给用户的data方法的统一处理入口。
access: function( owner, key, value ) {
var stored;
// 如果key和value没有传入,或者((key传入了并且key是String)但是value没有传入)
if ( key === undefined ||
((key && typeof key === "string") && value === undefined) ) {
//调用Data的get方法从owner上取出key的value。如果key为undefined,返回的是owner的所有数据
stored = this.get( owner, key );
//如果stored有值则返回该值,否则将key转换成驼峰式的字符串再次调用get方法取值,并返回
//也就是 如果key类似于"a-bc",会取出"a-bc" 和"aBc"的值
return stored !== undefined ?
stored : this.get( owner, jQuery.camelCase(key) );
}
//如果key和value都存在,或者key不是字符串(是对象),则调用Data的set方法,储存数据。
this.set( owner, key, value );
// 返回value或者是key,为啥。
return value !== undefined ? value : key;
},
// 删除owner存在cache中的key对应的值
remove: function( owner, key ) {
var i, name, camel,
// 拿到对应的cache索引
unlock = this.key( owner ),
// 通过索引取出存储在cache中的值
cache = this.cache[ unlock ];
// 如果没有传入key,则将此索引(键)对应的值设置为空对象(全部删除)
if ( key === undefined ) {
this.cache[ unlock ] = {};
// 如果传入了key
} else {
// 支持array或者是以空字符分割的String
if ( jQuery.isArray( key ) ) {
// 将key中的元素复制一份并转换成驼峰式,连接到原始数据的后面
name = key.concat( key.map( jQuery.camelCase ) );
} else {
// 如果不是数组,将key转换成驼峰式
camel = jQuery.camelCase( key );
// 如果key是cache中的其中一个键
if ( key in cache ) {
// 将key和脱分化之后的key组成一个数组赋值给name
name = [ key, camel ];
} else {
// 否则直接将驼峰化之后的key赋值个name
name = camel;
// 看看驼峰化之后的key是不是cache的键(统一格式)
name = name in cache ?
[ name ] : ( name.match( core_rnotwhite ) || [] );
}
}
// 删除key或者驼峰化之后的key
i = name.length;
while ( i-- ) {
delete cache[ name[ i ] ];
}
}
},
//检查owner(DOM)上是否有数据
hasData: function( owner ) {
return !jQuery.isEmptyObject(
this.cache[ owner[ this.expando ] ] || {}
);
},
// 删除owner上所有的数据,包括owner和cache的对应关系
discard: function( owner ) {
if ( owner[ this.expando ] ) {
delete this.cache[ owner[ this.expando ] ];
}
}
};
// 该方法是对DOM中属性为“data-xxx”的处理
function dataAttr( elem, key, data ) {
var name;
//如果从内部没有找到任何数据,则尝试读取DOM元素的attribute,找出以"data-"开头的属性
if ( data === undefined && elem.nodeType === 1 ) {
// 将驼峰化转换成'-'连接的小写字符串 (匹配大写字母,并将大写字母转换成"-小写字母"的形式)
name = "data-" + key.replace( rmultiDash, "-$1" ).toLowerCase();
// 从DOM上读取其"data-"开头的属性的值
data = elem.getAttribute( name );
// 如果data是String类型,则根据其String中的内容对其进行不同的处理
if ( typeof data === "string" ) {
//使用try catch的原因是?
try {
// 如果字符串是"true",则将字符串转换成boolean类型的true。false、null同true。
data = data === "true" ? true :
data === "false" ? false :
data === "null" ? null :
// 将其转换成数字再转换成字符串之后如果没有变化,则将其转换成数字?
+data + "" === data ? +data :
// 如果其中有{}或者[],则解析这个字符串成为json格式
rbrace.test( data ) ? JSON.parse( data ) :
data;
} catch( e ) {}
// 将在DOM属性上读取的数据存储到Data的cache中
data_user.set( elem, key, data );
} else {
data = undefined;
}
}
return data;
}
jQuery缓存机制(四)的更多相关文章
- jQuery缓存机制(一)
1.首先看一下涉及到jQuery缓存机制的代码结构: // 定义一些jQuery内部的变量,方便后续使用 var data_user, data_priv, // 后续会被赋值为两个Data对象 rb ...
- jQuery缓存机制(三)
缓存机制提供的入口有: $.data([key],[value]) // 存取数据 $.hasData(elem) // 是否有数据 $.removeData([key]) // 删除数据 $.acc ...
- (五)JS学习笔记 - JQuery缓存机制
历史背景 开发中常常因为方便,把状态标志都写到dom节点中,也就是HTMLElement,缺点: 循环引用 直接暴露数据,安全性? 增加一堆的自定义属性标签,对浏览器来说是没意义的 取数据的时候要对H ...
- jQuery缓存机制(二)
1.从用户调用的入口开始阅读,因为这是我们比较熟悉的部分(主要做参数的调整,根据不同的完成不同的功能) // 进入jQuery Data模块的入口 使用方法有三种,不传参,传一个参,传两个参.示例$( ...
- jquery源码解析:jQuery数据缓存机制详解1
jQuery中有三种添加数据的方法,$().attr(),$().prop(),$().data().但是前面两种是用来在元素上添加属性值的,只适合少量的数据,比如:title,class,name等 ...
- jquery源码解析:jQuery数据缓存机制详解2
上一课主要讲了jQuery中的缓存机制Data构造方法的源码解析,这一课主要讲jQuery是如何利用Data对象实现有关缓存机制的静态方法和实例方法的.我们接下来,来看这几个静态方法和实例方法的源码解 ...
- JS高级. 06 缓存、分析解决递归斐波那契数列、jQuery缓存、沙箱、函数的四种调用方式、call和apply修改函数调用方法
缓存 cache 作用就是将一些常用的数据存储起来 提升性能 cdn //-----------------分析解决递归斐波那契数列<script> //定义一个缓存数组,存储已经计算出来 ...
- mybatis(四)缓存机制
转载:https://www.cnblogs.com/wuzhenzhao/p/11103043.html 缓存是一般的ORM 框架都会提供的功能,目的就是提升查询的效率和减少数据库的压力.跟Hibe ...
- Java缓存学习之二:浏览器缓存机制
浏览器端的九种缓存机制介绍 浏览器缓存是浏览器端保存数据用于快速读取或避免重复资源请求的优化机制,有效的缓存使用可以避免重复的网络请求和浏览器快速地读取本地数据,整体上加速网页展示给用户.浏览器端缓存 ...
随机推荐
- ViewBag和ViewDate以及TempDate的区别
简单的说,就是 ViewBag 和 ViewData 是数据共享的(他们都是共享 ViewData 的数据),ViewBag 实际就是对 ViewData的一个操作的封装. 区别 : View ...
- 制作移动端手机网站过程中的SEO优化方法技巧
据国内三大运营商数据来看,中国的手机用户数已达10亿,超过2/5的移动用户每个月都会从手机终端访问网页,如今的移动端手机网站比例肯定有提升,但是对于这些存在的移动版本网站来说,马海祥查看了很大一部分手 ...
- [转]linux下lame的使用
找到這篇好文章,不得不说開源的Lame功能很強大 linux下lame的使用 % lame [参数] <输入文件名> [<输出文件名>] 如需查询更多参数,可输入下列命令: % ...
- Objective-C语法之指针型参数
main.m #import <Foundation/Foundation.h> /** * 测试指针型参数和普通参数的区别 * * @param a 指针型参数 * @param b 普 ...
- slab着色,可以减少cache conflict miss概率么?
以内部slab为例,管理区 + object总大小+left_over size = 1page,我们做个极端假设,cache为 direct-mapped caches. 1.没有采用slab着色: ...
- 主调度器schedule
中断处理完毕后,系统有三种执行流向: 1)直 ...
- How to make an HTTP request in Swift
from: http://stackoverflow.com/questions/24016142/how-to-make-an-http-request-in-swift You can use N ...
- Oracle With As 查询
WITH AS WITH AS短语,也叫做子查询部分(subquery factoring),可以让你做很多事情,定义一个SQL片断,该SQL片断会被整个SQL语句所用到.有的时候,是为了让SQL语句 ...
- 【调研】在总体为n的情况下,多少样本有代表性?
见这里: http://www.raosoft.com/samplesize.html
- Ruby 面向对象知识详解
Ruby 是纯面向对象的语言,Ruby 中的一切都是以对象的形式出现.Ruby 中的每个值都是一个对象,即使是最原始的东西:字符串.数字,甚至连 true 和 false 都是对象.类本身也是一个对象 ...