• 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;
    }

  • 相关阅读:
    话说地址栏的URL的最大长度
    程序员,我拿什么来拯救自己
    把女友升级为老婆的时候发生的BUG
    一个精典asp程序引发的错误引起的思考
    [转]提高 Web Service 数据传输效率的基本方法
    整理发布html的select控件实用js操作
    asp.net简单实现导出excel报表
    c#简单实现生成csv文件
    利用sql server直接创建日历
    jQuery学习笔记:效果
  • 原文地址:https://www.cnblogs.com/charling/p/3485873.html
Copyright © 2020-2023  润新知