jQuery   发布时间:2022-03-30  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了深入学习jQuery中的data()大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

data有什么作用?

在我们平时js编码过程中,我们经常会向DOM元素中添加各种自定义属性,这样有一个弊端。

  1、假设我们在DOM元素中添加一个属性,这个属性指向了某个js对象。 dom1.ele = jsObj

  2、当这个js对象发挥完作用后,我们已经用不到他了。这时候按理说应该把这个js变量清空,释放内存。大家都知道,如果一个js对象不存在任何外在引用的话,解释器会自动将其在内存中删除,这也是javascript相对于c++等手动管理内存的程序的优点。

  3、但是这时候问题来了,因为DOM元素引用了这个js对象,尽管这个js对象已经没有存在的意义了,但是解释器是不会把他删除的。如果想要把其删除,我们可能需要将DOM元素的这个属性设置为null。

  4、我们编写了这么多的代码,哪里能把 每个js对象是不是被DOM元素引用了都记住啊

  5、而且,假如DOM元素与js对象之间相互循环引用,根本就无法删除! 这就是内存泄漏

  6、所以,为了避免这种情况的发生,我们要尽量避免 引用数据(这里的引用数据可以说是javascript对象) 直接依附在DOM对象上。

  7、data就是用来搞定以上问题的方法

data是如何搞定以上问题的?

首先来说一说jQuery中Data实现的大体思路:

  1、首先我们创一个数据缓存池,这个缓存池专门用来存储 向 DOM对象或者jQuery对象附加的额外数据。

  2、当我们要向DOM对象或者jQuery对象附加额外数据的时候,我们附加的数据其实是保存于这个缓存池中

  3、DOM对象或者jQuery对象生成一个额外属性,这个属性保存了 附加数据在缓存池中的‘门牌号'(位置或者索引)

  4、当我们访问DOM对象或者jQuery对象的附加数据时,实际上是先取得其附加数据的门牌号,然后找到缓存池中对应门牌号的数据,进行操作。

大体思路讲完,那么来分析一下具体思路:

在jQuery中,有一个Data构造函数,每当运行这个构造函数时,就会生成一个实例。

jQuery认会自动生成两个Data实例:

  var dataPriv = new Data() jQuery私有的,我们尽量不要对这个实例进行操作。

  var dataUser = new Data() 这个就是服务于用户了,我们使用data()方法都是对这个实例进行操作。

所有的Data实例都有以下属性

  expando: 值为字符串类型,每个Data实例的expando属性的值都不相同,用来区分不同的Data实例,类似于id的作用,expando的值就是上文中的额外属性

  uid: 这就是上文中的门牌号,初始为1,随着不同对象的附加数据的加入,自增长。

  cache : 一个对象 {} ,这就是缓存池了。

来个实例:


大佬总结

以上是大佬教程为你收集整理的深入学习jQuery中的data()全部内容,希望文章能够帮你解决深入学习jQuery中的data()所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签:datajquery