Heim > Web-Frontend > js-Tutorial > Kapselung, eines der JavaScript-Entwurfsmuster

Kapselung, eines der JavaScript-Entwurfsmuster

高洛峰
Freigeben: 2016-11-25 11:03:01
Original
1069 Leute haben es durchsucht

Für diejenigen, die mit C# und Java vertraut sind, müssen die drei Hauptideen der Objektorientierung (Kapselung, Vererbung, Polymorphismus) verstanden werden. Heute möchte ich darüber sprechen, wie die Kapselungsfunktion in Javascript verwendet wird !

Wir werden einige Dinge in der Realität in eine Klasse abstrahieren und die Attribute (Substantive) der Dinge als Eigenschaften der Klasse und die Aktionen (Verben) der Dinge als Methoden der Klasse verwenden. In objektorientierten Sprachen (C# usw.) gibt es einige Schlüsselwörter zum Ändern von Klassen oder Eigenschaften (Private, Public, Protect). Diese Schlüsselwörter beschreiben die Zugriffsberechtigungen und werden nicht im Detail erläutert.

Werfen wir einen Blick auf die veränderlichen Eigenschaften von Javascript (wir verwenden immer noch das Beispiel vom letzten Mal):


var Man = function (name, age) { this.Name = name ; This.Age = age; } var Person = new Interface("Person", ["GetName", "GetAge"]); function () { return this.Age; } } } var Alan = new Man("Alan", 25); warning(Alan.GetAge()); GetName( ) + "; Age: " + this.GetAge() } warning(Alan.DisplayAll());


Ich habe zuerst eine Klasse (anonyme Javascript-Methode) mit 2 öffentlichen (public) erstellt. Felder (dieser Blog wird ausführlich erklärt, lesen Sie weiter) und 2 öffentliche Methoden, wir haben eine Instanz erstellt – Alan, aber ich kann dieser Instanz dynamisch eine DisplayAll-Methode hinzufügen. Ich denke, dass keine objektorientierte Sprache dies tun kann. eine der flexiblen Ausführungsformen von Javascript.

Nehmen wir nun ein Szenario an, aufgrund der Variabilität von Javascript können Programmierer den Wert von Name nach der Instanziierung ändern, sodass die Initialisierungsaktion jetzt bedeutungslos ist:


var Alan = new Man("Alan", 25 ());


Wir können dieses Feld also nicht willkürlich ändern. In Java oder C# brauchen wir nur Um dieses Feld in „Privat“ zu ändern, ist alles in Ordnung, aber Javascript funktioniert nicht. Dieses Schlüsselwort, dann müssen wir dies tun, das ist die Bedeutung dieses Blogs

Wir können darüber nachdenken, was wir sonst noch tun können C# außer der Einstellung „Privat“? Wir können Setter- und Getter-Methoden festlegen.

Ändern wir den obigen Code: Rufen wir Methode eins auf:


var Person = new Interface("Person", ["SetName", "SetAge", "GetName" , " GetAge"]); var Man = function (name, age) { this.SetAge(age); this.SetName(name); } Man.prototype = { SetName: function (name) { this.Name = name; }, SetAge: function (age) { this.Age = age; },         GetName: function () { return this.Name },          GetAge: function () { return this.Age;                                                          GetName: function ()       Alan", 25); Alan.Name = "Alice"; //Es ist eine Tragödie, ich habe mich in Alice verwandelt, als ich Alan.SetAge(10);//Es ist eine Tragödie, jemand hat mir eine so junge Alterswarnung gegeben(Alan .GetName()); Alan.DisplayAll = function () { return "Name: "+this.GetName() + "; Age: " + this.GetAge() } warning(Alan.DisplayAll());


Wir haben festgestellt, dass es wie Setter und Getter in C# aussieht, aber dennoch extern geändert werden kann. Aus Sicht der Einschränkungen scheint es jedoch besser zu sein als der obige Code. Der Anfangswert wird durch Methoden festgelegt. Aber das Problem ist immer noch nicht gelöst. Schauen wir uns die folgende Methode an: Schließung

//Ich muss erklären, dass Berechtigungen (öffentlich) über das Schlüsselwort This in Javascript entwickelt werden.

Bevor wir über Abschlüsse sprechen, müssen wir die Essenz von Abschlüssen verstehen: In Javascript haben nur Methoden einen Gültigkeitsbereich. Wenn die in der Methode deklarierten Variablen von außen nicht zugänglich sind, kommt das Konzept von Private zum Vorschein.


var Person = new Interface("Person", ["SetName", "SetAge", "GetName", "GetAge"]); var Man = function (newname, newage) { var name , age; this.SetName = function (newname) { name = newname; } this.GetName = function (newage) { return name; { return age; } this.SetAge(newage); var Alan = new Man("Alan", 25); geändert werden Alan.SetAge(10); //Tragödie, jemand anderes hat mir eine so junge Alterswarnung gegeben(Alan.GetAge());


Jetzt ist die private Funktion implementiert, wir haben dies gerade ersetzt mit Var. //Wir rufen Methoden auf, die öffentlich sind und auf private, sogenannte privilegierte Methoden zugreifen können, wie zum Beispiel this.SetName, this.SetAge.

Wenn unsere öffentliche Methode keinen Zugriff auf private Felder beinhaltet, können wir sie in Prototype einfügen . //Der Vorteil besteht darin, dass bei mehreren Instanzen nur eine Kopie im Speicher vorhanden ist


Man.prototype.DisplayAll = function () { return "Name: " + this.GetName() + "; Alter: " + this.GetAge() }


Haha~ Schauen wir uns etwas etwas Schwierigeres an: statische Variablen und Methoden

Wir alle kennen das statische Dinge gehören zu Klassen (Klasse), ändern wir den obigen Code:


var Person = new Interface("Person", ["SetName", "SetAge", "GetName", "GetAge", "GetCount" ]); var Man = (function () { var count = 0; return function (newname, newage) { var name, age; this.SetName = function (newname) { name = newname; } this.SetAge = function (newage) { age = newage; } this.GetName = function () { return name; newage); this.SetName(newname);                count++;                                                                                                                                                            . Alan 1 = new Man("Alan", 25); var Alan2 = new Man("Alan", 25); +"Instanzen des Menschen" );


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