jQuery原型

版权声明:本文为博主原创文章,转载请附上原文地址 https://blog.csdn.net/writing_happy/article/details/79779831

jQuery的原型

  鉴于该死的控制台给我输出了一些奇奇怪怪的东西让我十分茫然所以无奈之下稍稍了解了一下jQuery的原型相关知识,可能不是那么的深入不要见怪。
  问题的起源是使用jQuery获取元素,结果集的原型(共有属性)是什么。
  当然,先说说原型的故事。

原型

  原型,维基百科的解释是原型是首创的模型,代表同一类型的人物、物件、或观念。在js里边,原型就是共有属性。
  我们都知道,在我们新构造一个Object对象的时候,即使什么都没有做也可以直接通过这个对象来调用一些方法,比如toString方法,那么这是怎么实现的呢?答案是原型。
  声明一个对象var xxx = new Object(),此时你以为这个对象是{},里边什么都没有,但其实不是这样的。就算你什么都不写,里边依然有一个__proto__属性。属性的值是包括toString在内的一堆方法,这些就是对象的共有属性。这些属性存在object的构造函数Object.prototype中,在我们声明一个对象的时候,Object.prototype同时被赋值给了xxx.__proto__。所以我们可以说对象xxx的原型是Object.prototype。
  如果你构造一个number对象,var num = new Number(),那么num.__proto__里边存的就是Number.prototype的值,但是number对象不仅有number的共有属性,也包含object的共有属性。所以在Number.prototype里边依然存了一个__proto__属性,里边存储了Object.prototype的值。也就是说,Number.prototype.__proto__ === Object.prototype。这就是原型链。

jQuery的原型

  使用jQuery构造出来的对象同样也有属于它的原型,它的原型到底是什么呢?
  在控制台输入var aaa = new Number(),得到的aaa是一个number对象,里边属性是__proto__: Number,虽然实际上应该是__proto__: Number.prototype(所以有人说千万不要相信控制台因为它乱输出的…..然而我还是信了),不过这样我们也还能理解的是吧?aaa的共有属性就是Number的共有属性呗。然后再继续往下看可以看见aaa.__proto__.__proto__的值是Object(实际上是Object.prototype),也很好理解。

  但是,重点在但是。
  你用jQuery取一个元素,然后在控制台打印出来。
  这是我写的js代码

var xxx = $('li')
console.log(xxx)

  Chrome浏览器控制台打印出来是这样的

  FireFox浏览器控制台打印出来是这样的

  微软的Edge控制台打印出来是这样的

  不一样!!不!一!样!!!因为之前一直用的Chrome所以被它的Object(0)困惑了好久,百思不得其解的我在控制台输出Object(0).prototype得到的结果是undefined,直接输出Object(0)发现它的类型居然是number,然后一个激灵突然意识到Object(0)不过是在构造一个数值为0的number对象,就像是Object('wcy')是在构造一个string对象一样…此时的心情是崩溃的。一叶障目的我搜索的关键词一直是Object(0) 原型链。。。。。再一次证明不要相信控制台的输出。
  所以我换了一种思路,不要把它的原型和Object(0)联系起来。这样一想就简单多了。搜索一下jQuery 原型你就能得到想要的结果。
  xxx.__proto__ === jQuery.prototype === $.prototype,是的就是这么简单。而jQuery的原型则是Object.prototype。也就是说jQuery.prototype.__proto__ === Object.prototype
  不敢相信我写了这么多居然得出的是这么简单的一条结论。。。。心痛

猜你喜欢

转载自blog.csdn.net/writing_happy/article/details/79779831