浅谈jQuery构造函数分析
在我的上一篇文章里面 阐述了jQuery的大致框架,知道了所有代码都是写在了一个自调用匿名函数里面,并且传入了window对象,源码是这样的:
(function( window, undefined ) {...})( window );
我们通过alert(jquery) 知道它是一个对象,那么这个对象是怎么构造出来的呢?我们使用$(document)类似的写法获取元素,就好像直接调用了普通的方法一样,jQuery就是普通的函数吗?如果是构造函数为什么不是 new $(document)的常见形式呢?
其实jQuery是面向对象js库,也有构造函数,每次调用jQuery方法是就会实例化一个jQeury对象,但是jQuery的写法却非常高明。
首先先谈谈js面向对象: js虽然不是面向对象的语言,却又很多面向对象的写法,这里推荐大家看一下图灵的《javascript高级程序设计》中的面向对象的程序设计部分。在众多方法中比较常使用的写法是构造加原型方式,下面举例:
var Person=function(name,age){ this.name=name; this.age=age; } Person.prototype={ constructor:Person, init:function(msg){ this.say(msg); }, say:function(msg){ alert(this.name+'说'+msg); } }; var tom=new Person('tom',23); tom.init('你好');// tom说你好
其实jQuery也是采用的这种方式只不过用了更聪明的写法,一起再看看jQuery的构造函数有什么不同
// Define a local copy of jQuery var jQuery = function( selector, context ) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery.fn.init( selector, context, rootjQuery ); },
从源码中可以看到在jQuery真正的函数是init方法,当我们调用jQuery时会返回new init()的结果而不直接new jQuery() .
jQuery.fn是啥呢,在后面我们会看到这样一句代码
jQuery.fn = jQuery.prototype = {...
这样就很好理解了,其实jQuery.fn就是原型对象也就是说在jQuery原型里面有一个init方法,这个方法是真正的构造函数。这样写的好处就是不需要在写$().init()这样的操作,直接就初始化了,但是还有一个问题就是既然init才是构造函数那我们写在jQuery上面的那么方法实例不是不能调用吗?init的实例化自然只能调用init的方法啦,往后看到这样一句代码
// Give the init function the jQuery prototype for later instantiation jQuery.fn.init.prototype = jQuery.fn;
之前讲过jQuery.fn=jQuery.protype,这就意味着jQuery的原型对象赋给了init的原型,这样jQuery的原型方法自然init也就都有了,通过这样构造方式S使得使用jQuery方法非常简单既不需要new jQuery()的操作也不需要手动初始化就行调用普通函数一样简单。
您可能感兴趣的文章:
- C/C++—— C++中构造函数不能是虚函数的原因分析
- 关于构造函数和异常的分析
- PackageManagerService.java 构造函数的 分析
- 静态代码块,构造代码块,构造函数的执行分析
- Javascript 构造函数 实例分析
- C++11模板句柄的实现:委派构造函数、default关键字分析
- 9.4 编写一个程序,通过执行结果分析在引用类对象时是否执行类的构造函数与析构 函数。
- 在QT环境下,实例分析构造函数与析构函数的执行时机
- C++例题分析1 构造函数初始化
- 从汇编看c++中默认构造函数的使用分析
- 黑马程序员_java静态代码块、构造代码块和构造函数的执行时间分析
- Unreal Engine 4 C++ UCLASS构造函数易出错分析
- java学习中对构造函数和对象的理解,及对象的运行路径分析
- Java中,关于在子类构造函数中调用父类构造函数完成对象创建的简单分析
- 【c++】通过具体实验对比分析“构造函数”与“析构函数”
- 在Java继承中,非构造函数的方法的分析
- PackageManagerService(Android5.1)深入分析(一)构造函数
- ASP.NET私有构造函数用法分析
- C++中的构造函数初始化列表的使用和分析
- 匿名内部类构造函数分析