jQuery.expando = "jQuery" + ( version + Math.random() ).replace( /\D/g, "" )

"jQuery" + ".." + . == "jQuery..." 

jQuery30009423638425146147"

jQuery 300 024727210109188635 1
jQuery 300 024727210109188635 2

var acceptData = function( owner ) {
  // Accepts only:
  // - Node
  //  - Node.ELEMENT_NODE
  //  - Node.DOCUMENT_NODE
  // - Object
  //  - Any
  /* jshint -W018 */
  return owner.nodeType === 1 || owner.nodeType === 9 || !( +owner.nodeType );
};

// If it is a node unlikely to be stringify-ed or looped over
// use plain assignment
if ( owner.nodeType ) {
  owner[ this.expando ] = value;
// Otherwise secure it in a non-enumerable property
// configurable must be true to allow the property to be
// deleted when data is removed
} else {
  Object.defineProperty( owner, this.expando, {
    value: value,
    configurable: true
  } );
}

elem['jQuery3000247272101091886351'] = dataObj;
var person = {name: 'John', age: 30};
Object.defineProperty( person, 'jQuery3000247272101091886351', {
  value: dataObj,
  configurable: true
} );

cache: function( owner ) {
  // Check if the owner object already has a cache
  var value = owner[ this.expando ];
  // If not, create one
  if ( !value ) {
    value = {};
    // We can accept data for non-element nodes in modern browsers,
    // but we should not, see #8335.
    // Always return an empty object.
    if ( acceptData( owner ) ) {
      // If it is a node unlikely to be stringify-ed or looped over
      // use plain assignment
      if ( owner.nodeType ) {
        owner[ this.expando ] = value;
      // Otherwise secure it in a non-enumerable property
      // configurable must be true to allow the property to be
      // deleted when data is removed
      } else {
        Object.defineProperty( owner, this.expando, {
          value: value,
          configurable: true
        } );
      }
    }
  }
  return value;
},

set: function( owner, data, value ) {
  var prop,
    cache = this.cache( owner );
  // Handle: [ owner, key, value ] args
  // Always use camelCase key (gh-2257)
  if ( typeof data === "string" ) {
    cache[ jQuery.camelCase( data ) ] = value;
  // Handle: [ owner, { properties } ] args
  } else {
    // Copy the properties one-by-one to the cache object
    for ( prop in data ) {
      cache[ jQuery.camelCase( prop ) ] = data[ prop ];
    }
  }
  return cache;
},

get: function( owner, key ) {
  return key === undefined "htmlcode">

access: function( owner, key, value ) {
  // In cases where either:
  //
  //  1. No key was specified
  //  2. A string key was specified, but no value provided
  //
  // Take the "read" path and allow the get method to determine
  // which value to return, respectively either:
  //
  //  1. The entire cache object
  //  2. The data stored at the key
  //
  if ( key === undefined ||
      ( ( key && typeof key === "string" ) && value === undefined ) ) {
    return this.get( owner, key );
  }
  // When the key is not a string, or both a key and value
  // are specified, set or extend (existing objects) with either:
  //
  //  1. An object of properties
  //  2. A key and value
  //
  this.set( owner, key, value );
  // Since the "set" path can have two possible entry points
  // return the expected data based on which path was taken[*]
  return value !== undefined "htmlcode">

remove: function( owner, key ) {
  var i,
    cache = owner[ this.expando ];
  if ( cache === undefined ) {
    return;
  }
  if ( key !== undefined ) {
    // Support array or space separated string of keys
    if ( jQuery.isArray( key ) ) {
      // If key is an array of keys...
      // We always set camelCase keys, so remove that.
      key = key.map( jQuery.camelCase );
    } else {
      key = jQuery.camelCase( key );
      // If a key with the spaces exists, use it.
      // Otherwise, create an array by matching non-whitespace
      key = key in cache "htmlcode">

hasData: function( owner ) {
  var cache = owner[ this.expando ];
  return cache !== undefined && !jQuery.isEmptyObject( cache );
}


二、Data在jQuery内部的使用
以上解读完了 Data 的所有方法，上面也提到 Data 类是在 jQuery 内部使用的，一共创建了它的两个对象：dataPriv 和 dataUser。
这两个对象在 3.0.0 中有着明确的分工，dataPriv 可以猜测到是 “data” 和 “private” 两个单词的组合后简写。即 dataPriv 是私有的用来服务 jQuery 内部方法，dataUser 用来服务那些公开给用户使用的方法。
下面看下这两个对象分布在哪些模块中使用。

完整版点击展开可查看


dataPriv
  公共
    $.hasData
    $.cleanData
    cloneCopyEvent
  队列
    $().queue
    $()._queueHooks
    $().promise
  动画
    $().animate
    $().stop
    $().finish
    showHide
  事件
    $.event.add
    $.event.remove
    $.event.dispatch
    $.event.trigger
  其它
    setGlobalEval
    domManip
    defaultPrefilter
    $().toggleClass
dataUser
  公共
    $.hasData
    $.cleanData
    cloneCopyEvent
  数据缓存
    $.data
    $.removeData
    $().data
    $().removeData
  其它
    dataAttr


以上可以看到，除了“公共”，DataPriv 用在了 jQuery 的 队列、动画、事件等模块；dataUser 用在了数据缓存及dataAttr模块。
“公共” 是指这三个方法内都用到了 dataPriv 和 dataUser
$.hasData(elem)
用来判断 elem 上是否绑定了相关的数据缓存，返回 true 和false，只有 dataPriv 和 dataUser 上都没有才返回 false
源码


hasData: function( elem ) {
return dataUser.hasData( elem ) || dataPriv.hasData( elem );
},


$.cleanData(elems)
清空 elem 上绑定的所有数据缓存，理所当然的需要同时清空 dataPriv 和 dataUser 上的。

注意：虽然这个方法在公开暴露在了 $ 上， 但官网API上却没有该方法的介绍。另使用不当会造成严重后果，比如绑定了事件后（.on），调用该方法，绑定的事件将全部失效。因为会清空 dataPriv 内的所有数据。
cloneCopyEvent(src, dest)
这是一个内部方法，$.clone 会使用到它。克隆元素时除了会克隆node节点外，绑定在node上的数据也会被克隆过去。比如


var cloneNode = $.clone(elem);


把 elem 克隆给 cloneNode，此时 elem 上添加的事件 cloneNode 上也会有。
三、1.x.x 和 2.x.x 的比较
jQuery 1.x 系列 和 2.x 系列的版本对 数据缓存模块的实现差异还是很大的。大家可以对比我11年的这篇文章
1. 缓存的数据结构
1.x (直到1.11.2) 缓存都是存储在 jQuery.cache 上的，2.x(包括3.x) 则使用了一个内部类 Data 做缓存，其主要用到了两个对象 dataPriv 和 dataUser。很明显 2.x 做的更好，它所有的缓存数据都是私有的，不会存在被误写的风险，而 1.x 的 jQuery.cache 是公开的，如果被误写（比如某个同学想当然的给$上添加一个cache对象）后果不堪设想。
2. jQuery._data
看到这个下划线就知道是私有的（约定式），在 1.x 中是仅在内部使用的，不提供给开发者。以 1.11.2 示例、这个方法被事件模块、队列模块、动画模块、setGlobalEval、cloneCopyEvent、fixCloneNodeIssues、domManip、showHide、defaultPrefilter、toggleClass 使用。3.x 则使用 dataPriv 和 dataUser 替代，大家可以对比看看。
(2/3).x 相比 1.x 明显更优，dataPriv 和 dataUser 是真正的私有的（封装的更好，更安全），比起 1.x 约定式的私有 jQuery._data。虽然 3.0.0 还保守的兼容了 jQuery._data，相信过不了多久的后续版本就会剔除。



3. 重构
1.x 以 $._data 为中心，以它来辅助实现其它 API， (2/3).x 以 dataPriv/dataUser 为中心来实现。(2/3).x 将代码重构后提取出了 Data 类，更加清晰。
以上所述是小编给大家介绍的jQuery 3.0中的Data的全部叙述，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！

                                
                                

                                    jquery3.0,data 
                                

                                    标签：
                                        
jquery3.0,data
                                     

                                
相思资源网 Design By www.200059.com