Heim > Web-Frontend > js-Tutorial > Hauptteil

Ausführliche Bauerklärung ohne Neuware

php中世界最好的语言
Freigeben: 2018-03-15 16:04:14
Original
1470 Leute haben es durchsucht

Dieses Mal werde ich Ihnen eine detaillierte Erklärung des neuen kostenlosen Builds geben. Was sind die Vorsichtsmaßnahmen, wenn Sie den neuen kostenlosen Build verwenden?

Vorwort

Wenn wir ein Objekt erstellen möchten, können wir die neue Methode verwenden, um ein Objekt zu konstruieren. Dann liegt es auf der Hand, dass jquery auch ein Objekt ist und mit new jquery() erstellt werden sollte. Warum erstellen wir ein JQuery-Objekt, ohne new jquery() zu verwenden, sondern verwenden direkt eine Methode ähnlich zu $(ele)? ein JQuery-Objekt erstellen? Tatsächlich wird intern immer noch new verwendet, aber jquery hilft uns, es intern zu erstellen

function Jquery(selector, context) {
  return new Jquery(selector, context);
 }
 Jquery.prototype = {
  version:'1.01'
 }
Nach dem Login kopieren

, um es intern zu verwenden. Es ist offensichtlich problematisch In diesem Fall wird eine Endlosschleife gebildet. Um das Problem der Endlosschleife zu lösen, schauen Sie sich bitte den folgenden Code an:

function Jquery(selector, context) {
 return Jquery.prototype.init(selector, context);
}
Jquery.prototype = {
 version:'1.01',
 init: function () {
  this.name = "lin";
  return this;
 }
}
var a = Jquery();
var b = Jquery();
console.log(a.version); //1.01
console.log(a.name); //lin
a.name = "na";
console.log(b.name); //na
Nach dem Login kopieren

Das Problem der Endlosschleife wurde zwar gelöst, aber es wurde ein neues Problem entdeckt Die Attribute der beiden Objekte a und b sind gemeinsam. Ja, ich habe das Attribut a.name in na geändert, und das Attribut b.name wurde ebenfalls in na geändert. Der Grund dafür ist, dass dies auf Jquerys

verweist. Um dieses Problem zu lösen, können wir jedes Mal ein neues Objekt erstellen. Der verbesserte Code lautet wie folgt: Jquery()

function Jquery(selector, context) {
 return new Jquery.prototype.init(selector, context); //注意看,这里多了个new
}
Jquery.prototype = {
 version:'1.01',
 init: function () {
  this.name = "lin";
  console.log(this);
  return this;
 }
}
var a = Jquery();
var b = Jquery();
console.log(a.version); //undefined
console.log(a.name); //lin
a.name = "na";
console.log(b.name); //na
Nach dem Login kopieren
Nach der Verarbeitung auf diese Weise wird das Attributproblem gelöst Die gemeinsame Nutzung wurde gelöst. Jedes Objekt interagiert miteinander. Es wurde jedoch ein neues Problem entdeckt Der Grund dafür ist, dass

und Jquery.prototype sich zu diesem Zeitpunkt gegenseitig ausschließen. Wir haben also ein Jquery.prototype.init.prototype-Objekt erstellt, sodass wir die Attribute nur auf Jquery.prototype.init lesen können nicht die Attribute auf Jquery.prototype.init.prototype (dieses Beispiel bezieht sich auf das Versionsattribut). Weisen Sie einfach Jquery.prototype zu Jquery.prototype zu, was dem Zuweisen aller Attribute auf dem Jquery-Prototyp zum Prototyp von . Bitte sehen Sie sich den folgenden Code an: Jquery.prototype.init.prototypeJquery.init

Wie Sie sehen können, gibt die Konsole das Versionsattribut eines Objekts aus, das gelesen und gedruckt werden kann.
function Jquery(selector, context) {
 return new Jquery.prototype.init(selector, context);
}
Jquery.prototype = {
 version:'1.01',
 init: function () {
  this.name = "lin";
  return this;
 }
}
Jquery.prototype.init.prototype = Jquery.prototype; //画龙点睛之笔
var a = Jquery();
var b = Jquery();
console.log(a.version); //1.01
console.log(a.name); //lin
a.name = "na";
console.log(b.name); //na
Nach dem Login kopieren

Zu diesem Zeitpunkt ist der neue, kostenlose Aufbau von Jquery abgeschlossen.

ps: jQuery.fn ist eigentlich der Prototyp von jQuery. Sie können diese Anweisung im jquery-Quellcode sehen: jQuery.fn = jQuery.prototype = {}; $() Es ist eigentlich dasselbe wie jquery() Sie können diese Anweisung im Jquery-Quellcode sehen:

window.jQuery = window.$ = jQuery;

Prototyp-Prototyp

Wissen Sie, was ein Prototyp ist?

In

JavaScript

ist der Prototyp auch ein Objekt. Durch den Prototyp können die Eigenschaften des Objekts Erben realisiert werden Interne Eigenschaft „[[Prototyp]]“, diese Eigenschaft entspricht dem Prototyp des Objekts. Die beiden Attribute „Prototyp“ und „

Proto

“ können manchmal verwechselt werden. „Person.prototype“ und „Person.proto“ sind völlig unterschiedlich.

Hier eine kurze Einführung zu „Prototyp“ und „Proto“:

Für alle Objekte gibt es ein Proto-Attribut, das dem Prototyp des Objekts entspricht .

Für Funktionsobjekte gibt es zusätzlich zum Proto-Attribut auch ein Prototyp-Attribut. Wenn eine Funktion als

Konstruktor

zum Erstellen einer Instanz verwendet wird, ist der Prototyp-Attributwert des Die Funktion wird als Prototyp verwendet. Weisen Sie allen Objektinstanzen Werte zu (d. h. legen Sie das Proto-Attribut der Instanz fest)

Ich glaube, Sie haben die Methode gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!
function Person(name, age){
this.name = name;
this.age = age;
}
Person.prototype.getInfo = function(){
console.log(this.name + " is " + this.age + " years old");
};
//调用
var will = new Person("Will", 28);
will.getInfo();//"Will is 28 years old"
Nach dem Login kopieren

Empfohlene Lektüre:

Wie zwei zTree miteinander interagieren


Wie man Webpack zum Schreiben der JQuery-Umgebungskonfiguration verwendet

So konvertieren Sie Groß- und Kleinschreibung automatisch, wenn Jackson die JSON-Zeichenfolge analysiert

Verwenden des jQuery EasyUI-Faltpanels

Das obige ist der detaillierte Inhalt vonAusführliche Bauerklärung ohne Neuware. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage