zoukankan      html  css  js  c++  java
  • jQuery缓存机制(三)

    缓存机制提供的入口有:

    $.data([key],[value]) // 存取数据

    $.hasData(elem) // 是否有数据

    $.removeData([key]) // 删除数据

    $.acceptData(elem) // 检测元素是否可以使用缓存机制存数据

    $(elem).data([key],[value]) // 存取数据

    $(elem).removeData([key]) // 删除数据

    已经阅读了缓存机制为用户提供的入口,并且重点阅读了$(elem).data()方法(其它方法都是直接调用data_user对象的方法),

    接下来重点看data_user对象封装的属性和方法

    Data.prototype = {

      // 生成一个key使用它将cache和元素联系起来,并最终返回这个key
      key: function( owner ) {
        //如果owner不是元素节点或document节点,则返回0,为什么返回0?为了校验?
        if ( !Data.accepts( owner ) ) {
          return 0;
        }
        // 一个暂时的对象,将被扩展到owner对象上。
        var descriptor = {},
        // 判断owner对象上是否已经有这个jQuery随机产生的键。
        // 这里的this是后面new 出来的Data对象,所以其expando是固定的值,对在该data对象内存取数据的elem都是一致的
        unlock = owner[ this.expando ];

        // 如果没有这个键,则为owner对象创建一个。
        if ( !unlock ) {
          // 每次有新的对象想要调用data存储数据,都将uid增加1。保证唯一性。该uid是cache中的键
          unlock = Data.uid++;

          try {

            // 为descriptor添加属性(expando的值),将生成唯一id关联在descriptor上。
            descriptor[ this.expando ] = { value: unlock };

            // 再将descriptor关联在owner上,使owner最终和unlock关联起来,用于在cache中操作数据

            // 第二个参数应该是字符串?传一个对象进来不知道是怎么操作的,需要深入了解下definePropertyies方法
            Object.defineProperties( owner, descriptor );

          } catch ( e ) {

            // 处理元素上不能存对象的情况
            descriptor[ this.expando ] = unlock;
            jQuery.extend( owner, descriptor );
          }
        }

        // 如果cache[unlock]没有值,则将其值设置为空对象
        if ( !this.cache[ unlock ] ) {
          this.cache[ unlock ] = {};
        }
        //返回一个cache的索引
        return unlock;
      },
      set: function( owner, data, value ) {
        var prop,
          // 存数据之前,先调用key方法,拿到元素上绑定好的唯一UID,如果没有就创建一个
          unlock = this.key( owner ),

          // 根据这个UID到cache中拿到已经存储的数据,如果之前没有存储过,会返回一个空对象
          cache = this.cache[ unlock ];

        // 处理三个参数都存在的情况
        if ( typeof data === "string" ) {

          // 以data为键,以value为值将数据存储到cache中,如果之前存过就覆盖掉
          cache[ data ] = value;

        //处理只有两个参数,并且第二个参数是个对象的情况
        } else {
          // 如果cache中是空的
          if ( jQuery.isEmptyObject( cache ) ) {

            // 将data对象扩展到cache。不需要深度扩展?
            jQuery.extend( this.cache[ unlock ], data );
          // 如果不是空对象,需要一个一个赋值。?
          } else {
            for ( prop in data ) {
              cache[ prop ] = data[ prop ];
            }
          }
        }
        return cache;
      },
      get: function( owner, key ) {
        // 创建一个cache,将owner存储到Data对象的cache中的所有数据缓存起来。
        var cache = this.cache[ this.key( owner ) ];
        // 如果key存在则返回key对象的值,否则将owner上的所有值都返回。
        return key === undefined ?
        cache : cache[ key ];
      },
      // 剩下的四个方法下次再看。

      access : function(){},

      remove : function(){},

      hasData : function(){},

      discard : function(){}  // Data虽然封装了这个方法,但并没有暴露出来,也没有在内部使用。作用是删除owner存储到cache中的所有数据

    };

  • 相关阅读:
    Script to Create Benchmark Procs
    自定义数据类型修改
    需求管理工具试用 – CaliberRM
    标识值重复的原因示例
    Vmware vFabric Suite开始支持自动化部署与PostgreSQL
    在ubuntu上安装Oracle Java SDK
    详解数据中心基础设施的模块化建设
    Xcode 4 无证书真机调试 环境配置
    Calculate_and_Insert_Event_Intervals_in_SQL2005_Profiler
    浏览器工作原理
  • 原文地址:https://www.cnblogs.com/charling/p/3482957.html
Copyright © 2011-2022 走看看