Was bedeutet Prototyp hier im jQuery-Quellcode?

Lesezeit: 3 Minuten

Benutzer-Avatar
liam xu

Als Beispiel kopiert von jQuery 1.2.6:

jQuery.fn = jQuery.prototype = {
    init: function( selector, context ) {
        // Make sure that a selection was provided
        selector = selector || document;
        ..........
    },
};

Ich habe hier einige Beiträge gelesen wie JavaScript: Wofür werden .extend und .prototype verwendet? und wissen, dass ein Prototyp in einer Unterklasse verwendet werden kann, um einige Methoden zu erweitern.

Aber ich kann die Verwendung im obigen Ausschnitt von jQuery nicht verstehen.

Gibt es kanonische Dokumente, die den Prototyp beschreiben?

Vielen Dank.

  • Sehen Sie sich die Tag-Info-Referenzen an. Insbesondere schlage ich Sie vor Dieser Artikel von Eloquent JavaScript und Dieses hier aus der ECMAScript-Sprachspezifikation.

    – Alberto de Caro

    30. Oktober 2012 um 13:44 Uhr


Alle Objekte haben eine prototype Eigentum. Es ist einfach ein Objekt, von dem andere Objekte Eigenschaften erben können. Das von Ihnen gepostete Snippet weist einfach ein Objekt mit einigen Eigenschaften zu (z init) zum prototype von jQueryund Aliase jQuery.prototype zu jQuery.fn Weil fn ist kürzer und schneller zu tippen. Wenn Sie jQuery vorübergehend vergessen, betrachten Sie dieses einfache Beispiel:

function Person(name) {
    this.name = name;
}
Person.prototype.sayHello = function () {
    alert(this.name + " says hello");
};

var james = new Person("James");
james.sayHello(); // Alerts "James says hello"

In diesem Beispiel Person ist ein Konstrukteur Funktion. Es kann sein instantiiert indem Sie es mit dem aufrufen new Operator. Innerhalb des Konstruktors, der this Das Schlüsselwort bezieht sich auf die Instanz, sodass jede Instanz ihre eigene hat name Eigentum.

Das prototype von Person wird von allen Instanzen geteilt. Also alle Instanzen von Person haben eine sayHello Methode, dass sie erben aus Person.prototype. Durch die Definition der sayHello Methode als Eigenschaft von Person.prototype Wir sparen Speicher. Wir könnten genauso gut jede Instanz von angeben Person eine eigene Kopie der Methode (durch Zuweisen zu this.sayHello innerhalb des Konstruktors), aber das ist nicht so effizient.

Wenn Sie in jQuery die aufrufen $ -Methode erstellen Sie wirklich eine Instanz von jQuery.prototype.init (erinnere dich daran jQuery.fn === jQuery.prototype):

return new jQuery.fn.init(selector, context, rootjQuery);

Und wenn man sich anschaut jQuery.fn.init:

jQuery.fn.init.prototype = jQuery.fn;

Sie erstellen also wirklich eine Instanz von jQuery die Zugriff auf alle deklarierten Methoden hat jQuery.prototype. Wie bereits erwähnt, ist dies viel effizienter, als diese Methoden für jede Instanz von zu deklarieren jQuery.

  • Ist jQuery.fn nur ein Name? Hat es eine Beziehung zu sogenannten Namensraum?

    – liam xu

    30. Oktober 2012 um 14:28 Uhr

  • fn ist eine Eigenschaft der jQuery Objekt (ebenso wie prototype ist nur eine Eigenschaft von jQuery Objekt). Der Wert sowohl der fn Eigentum und die prototype Eigenschaft ist ein Verweis auf ein einzelnes Objekt.

    – James Allardice

    30. Oktober 2012 um 14:30 Uhr

  • Danke! Was ist jQuery.fn.init.prototype = jQuery.fn; zum?

    – liam xu

    31. Oktober 2012 um 15:10 Uhr

  • @liamxu – Gern geschehen 🙂 Diese Zeile verursacht jQuery.fn.init um alle als Eigenschaften von deklarierten Methoden zu erben jQuery.fn. Wenn Sie also eine Instanz von erhalten jQuery.fn.init (was Sie bekommen, wenn Sie anrufen jQuery), hat es Zugriff auf alle üblichen jQuery-Methoden, die Sie erwarten würden. Ist das sinnvoll?

    – James Allardice

    31. Oktober 2012 um 15:17 Uhr

  • jQuery.fn.init ist eine Klasse (soweit “Klassen” sowieso in JavaScript gehen). Wenn Sie es mit der anrufen new -Operator erstellt er eine neue Instanz von jQuery.fn.init. Es ist ziemlich verwirrend, weil jQuery.fn.init.prototype ist jQuery.fnalso gibt es eine unendliche zyklische Referenz.

    – James Allardice

    31. Oktober 2012 um 15:42 Uhr

1226210cookie-checkWas bedeutet Prototyp hier im jQuery-Quellcode?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy