jQuery之$()

平常我们运用jQuery的时刻，都是运用$()，$指向全局的jQuery，所以实际上是挪用了jQuery()，效果是返回一个jq对象，但我们运用时却不需运用new建立对象，所以能够推想$()是一个工场函数。

$()的定义

jQuery()在src/core.js中定义，若在该要领中挪用return new jQuery()则堕入轮回，所以挪用init()辅佐组织实例。值得一提的是，jQuery.fn在/src/core.js指向了jQuery.prototype。

    // Define a local copy of jQuery
    jQuery = function( selector, context ) {

        // The jQuery object is actually just the init constructor 'enhanced'
        // Need init if jQuery is called (just allow error to be thrown if not included)
        return new jQuery.fn.init( selector, context );
    }

init要领的定义

jQuery.fn.init()在src/core/init.js中定义。要领接收三个参数selector, context, root，在要领内部，先推断是不是有参数，无参数时返回false。

    init = jQuery.fn.init = function( selector, context, root ) {
        var match, elem;

        // HANDLE: $(""), $(null), $(undefined), $(false)
        if ( !selector ) {
            return this;
        }

        // Method init() accepts an alternate rootjQuery
        // so migrate can support jQuery.sub (gh-2101)
        root = root || rootjQuery;

        // Handle HTML strings
        // < xxx > 或 $(#id)
        if ( typeof selector === "string" ) {
            if ( selector[ 0 ] === "<" &&
                selector[ selector.length - 1 ] === ">" &&
                selector.length >= 3 ) {

                // Assume that strings that start and end with <> are HTML and skip the regex check
                match = [ null, selector, null ];

            } else {
                // match[1]是html字符串，match[2]是婚配元素的id
                // selector是id选择器时match[1]为undefined，match[2]是婚配元素的id
                // selector是html字符串，match[1]是html字符串，match[2]为undefined
                match = rquickExpr.exec( selector );
            }

            // Match html or make sure no context is specified for #id
            // 婚配效果非空 且 存在婚配字符串或context空时实行
            // 未为id选择器限制查找局限
            if ( match && ( match[ 1 ] || !context ) ) {

                // HANDLE: $(html) -> $(array)
                if ( match[ 1 ] ) {
                    context = context instanceof jQuery ? context[ 0 ] : context;

                    // Option to run scripts is true for back-compat
                    // Intentionally let the error be thrown if parseHTML is not present
                    // 天生dom节点并合并到this上
                    jQuery.merge( this, jQuery.parseHTML(
                        match[ 1 ],
                        context && context.nodeType ? context.ownerDocument || context : document,
                        true
                    ) );

                    // HANDLE: $(html, props)
                    // 遍历props，增加属性或要领
                    if ( rsingleTag.test( match[ 1 ] ) && jQuery.isPlainObject( context ) ) {
                        for ( match in context ) {

                            // Properties of context are called as methods if possible
                            if ( jQuery.isFunction( this[ match ] ) ) {
                                this[ match ]( context[ match ] );

                            // ...and otherwise set as attributes
                            } else {
                                this.attr( match, context[ match ] );
                            }
                        }
                    }

                    return this;

                // HANDLE: $(#id)
                // 处置惩罚id选择器且无context
                } else {
                    elem = document.getElementById( match[ 2 ] );

                    if ( elem ) {

                        // Inject the element directly into the jQuery object
                        this[ 0 ] = elem;
                        this.length = 1;
                    }
                    return this;
                }

            // HANDLE: $(expr, $(...))
            // selector是选择器 context为undefined或context.jquery存在时实行。
            // $(#id,context)或$(.class [, context])等状况
            } else if ( !context || context.jquery ) {
                return ( context || root ).find( selector );

            // HANDLE: $(expr, context)
            // (which is just equivalent to: $(context).find(expr)
            } else {
                return this.constructor( context ).find( selector );
            }

        // HANDLE: $(DOMElement)
        // 传入DOM元素
        } else if ( selector.nodeType ) {
            this[ 0 ] = selector;
            this.length = 1;
            return this;

        // HANDLE: $(function)
        // Shortcut for document ready
        } else if ( jQuery.isFunction( selector ) ) {
            return root.ready !== undefined ?
                root.ready( selector ) :

                // Execute immediately if ready is not present
                selector( jQuery );
        }

        return jQuery.makeArray( selector, this );
    };

selector是字符串

假如有selector非空，先处置惩罚selector是字符串的状况，分为html字符串、$(selector)、$(expr, $(...))和$(expr, context)四种。假如selector是字符串范例，依据传入的字符串返回天生的dom节点，处置惩罚时先用正则婚配，查找html字符串或id。婚配效果非空且存在婚配字符串或context空时申明selctor是html字符串或selector是id选择器且未限制查找上下文。实行处置惩罚html字符串时，先肯定天生后的节点要插进去的document是哪一个(即context参数)，默许是加载jQuery的document，挪用$.parseHTML()天生dom节点并增加到this；假如context是对象，则是$(html, props)的挪用，将属性或许要领挂载到dom上，返回天生的jq对象。假如婚配到$(#id)的挪用且context空时，则直接挪用document.getElementById查找元素，元素存在时将this[0]指向该元素，返回查找效果。

假如selector不是id选择器或context非空，挪用find举行查找，假如context非空，则从context开始查找，不然全局查找，将查找效果作为返回值。

selector是DOM元素

接着处置惩罚传入参数是Dom元素的状况。将this[0]指向Dom元素，设置jq对象长度为1，并返回this。

selector是函数

末了处置惩罚$(function(){})，假如存在ready则挪用传入函数挪用ready(f())，不然传入jQuery，直接挪用函数，挪用makeArray，将其效果作为返回值。

修正init的原型

init = jQuery.fn.init = function( selector, context, root ) {
    ...
    }
// Give the init function the jQuery prototype for later instantiation
init.prototype = jQuery.fn;

在原型上定义要领init，然后将init的原型指向jQuery的原型，假如不这么做，则建立的实例的原型是init.prototype，不是jQuery.fn，实际上是init的实例而不是jQuery的实例，没法挪用在core.js中定义在jQuery.fn上的种种变量和要领。