CODEWITHSUNDEEP
jquery
Ricky
Ricky

Reputation: 35873

JQuery source code questions

I got two questions about following code snippet.

(1). What is the purpose of "return new jQuery.fn.init( selector, context, rootjQuery );"? Why does it return another instance inside the JQuery function?

(2). Why prototype.constructor is re-defined as 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.fn = jQuery.prototype = {
    constructor: jQuery,
    init: function( selector, context, rootjQuery ) {
        var match, elem, ret, doc;

Thank you!

Upvotes: 1

Views: 2219

Answers (2)

Rob W
Rob W

Reputation: 349062

  1. When JQuery is called as an ordinary function, a new (class) instance of JQuery is created and returned using new JQuery.fn.init(...). In this way, developers don't have to add the new keyword before $(..).
  2. JQuery.fn is a shortcut for JQuery.prototype. Writing JQuery.fn.customMethod = function(){...} is more convenient than writing JQuery.prototype.customMethod = .... Because JQuery is often also accessible through $ or $j, The shortesy way to refer to JQuery.prototype is $.fn.

Upvotes: 4

MaxC
MaxC

Reputation: 945

(2). Why prototype.constructor is re-defined as JQuery?

I think the reason is to keep a constructor reference inside each jQuery object, to actually itself (it creates a circular reference). In fact, by overriding the jQuery.prototype object with this piece of code

jQuery.fn = jQuery.prototype = { ... }

you lose the "automatically created" constructor (which points to the function it has been created from, in this case jQuery.fn.init), so you need to explicitly set it.

I've found this link very helpful to understand javascript prototype and contructor:

http://joost.zeekat.nl/constructors-considered-mildly-confusing.html

Upvotes: 1

Related Questions