Detaillierte Erklärung des Prototyps in js

Prototype ist eine Methode, die in IE 4 und späteren Versionen für Objekte einer bestimmten Klasse eingeführt wurde. Das Besondere daran ist: Es handelt sich um eine Methode zum Hinzufügen von Methoden zu Objekten einer Klasse! Das mag etwas verwirrend klingen, keine Sorge, ich werde diese spezielle Methode anhand der folgenden Beispiele erläutern:

Zunächst müssen wir das Konzept der Klassen verstehen, JavaScript selbst ist ein Objekt -orientierte Sprache, und die beteiligten Elemente werden entsprechend ihrer Attribute einer bestimmten Klasse zugeordnet. Zu unseren gängigen Klassen gehören: Array-Variablen (Array), logische Variablen (Boolean), Datumsvariablen (Date), Strukturvariablen (Function), numerische Variablen (Number), Objektvariablen (Object), String-Variablen (String) usw. und verwandte Klassenmethoden werden auch häufig von Programmierern verwendet (hier müssen wir zwischen Klassenaufmerksamkeits- und Attributsendemethoden unterscheiden), wie z. B. der Push-Methode des Arrays, der Get-Serien-Methode des Datums, der Split-Methode der Zeichenfolge usw .,
Aber spüren Sie im eigentlichen Programmierprozess die Mängel der vorhandenen Methoden? Die Prototypenmethode entstand! Im Folgenden erklären wir die spezifische Verwendung von Prototypen von flach bis tief anhand von Beispielen:

1 Das einfachste Beispiel zum Verständnis des Prototyps:

(1) Number.add ( num): Funktion, Zahlen hinzufügen

Implementierungsmethode: Number.prototype.add = function(num){return(this+num);}
Test: alarm((3).add(15 )) -> Anzeige 18

(2) Boolean.rev(): Funktion, boolesche Variable invertieren

Implementierungsmethode: Boolean.prototype.rev = function(){ return (!this);}
Test: alarm((true).rev()) -> Ist es einfach, false anzuzeigen

? In diesem Abschnitt erfahren die Leser lediglich etwas über eine andere Methode und wie diese Methode verwendet wird.

2. Implementierung und Erweiterung bestehender Methoden, erste Einführung in den Prototyp:

(1) Array.push(new_element)
Funktion: in Fügen Sie am Ende des Arrays ein neues Element hinzu

Implementierungsmethode:

Array.prototype.push = function(new_element){
this[this.length]=new_element ;
            diese Länge zurückgeben;

                                                                                                                                                                          

Implementierungsmethode:

Array.prototype.pushPro = function() {

var currentLength = this.length;

for (var i = 0; i < ; arguments.length; i++) {
this[currentLength + i] = arguments[i];
}
return this.length;


}

Es sollte nicht schwer zu verstehen sein, oder? Analog können Sie überlegen, wie Sie eine beliebige Anzahl von Elementen an einer beliebigen Position löschen können, indem Sie Array.pop erweitern (der spezifische Code wird nicht detailliert beschrieben).

(2) String.length

Funktion: Dies ist tatsächlich der Fall ein Attribut der String-Klasse, aber da JavaScript sowohl Zeichen voller als auch halber Breite als ein Zeichen behandelt, kann es in einigen praktischen Anwendungen zu bestimmten Problemen führen. Jetzt verwenden wir Prototypen, um diesen Mangel auszugleichen.

Implementierungsmethode:

String.prototype.cnLength = function(){

var arr=this.match(/[^x00-xff]/ig);

return this.length+ (arr==null?0:arr.length);


}

Test: alarm("EaseWe Spaces".cnLength()) -> Einige reguläre Ausdrucksmethoden und die Codierungsprinzipien von Zeichen voller Breite werden hier verwendet. Da sie zu zwei anderen größeren Kategorien gehören, wird in diesem Artikel nicht auf relevante Materialien verwiesen.

3. Um neue Funktionen zu implementieren, gehen Sie tief in die Prototypen ein: Was in der tatsächlichen Programmierung verwendet wird, ist definitiv nicht nur die Verbesserung bestehender Methoden, sondern auch weitere funktionale Anforderungen. Im Folgenden werde ich zwei Lösungen anhand von Prototypen nennen von praktischen Problemen:

(1) String.left()

Problem: Jeder, der VB verwendet hat, sollte die linke Funktion kennen, die n Zeichen von der linken Seite einer Zeichenfolge übernimmt, aber der Nachteil ist dass es die volle und halbe Breite konvertiert, werden als ein Zeichen betrachtet, was dazu führt, dass Zeichenfolgen gleicher Länge in einem gemischten chinesischen und englischen Layout nicht abgefangen werden können

Funktion: n Zeichen von der linken Seite der Zeichenfolge abfangen und unterstützt die Unterscheidung zwischen Zeichen voller und halber Breite

Implementierungsmethode:

String.prototype.left = function(num,mode){
If(!/d+/.test(num ))return(this);

var str = this.substr(0 ,num);

if(!mode) return str;
var n = str.Tlength() - str.length;
num = num - parseInt(n/2);
return this .substr(0,num);


}

Test:
warning("EaseWe Spaces".left(8)) -> Display EaseWe space
warning("EaseWe Spaces".left(8,true)) -> Display EaseWe Empty
Diese Methode verwendet die oben erwähnte Methode String.Tlength(), und einige gute neue Methoden können auch mit benutzerdefinierten Methoden kombiniert werden!

(2) Date.DayDiff()
Funktion: Berechnen Sie das Intervall zwischen zwei Datumsvariablen (Jahr, Monat, Tag, Woche)
Implementierungsmethode:

Date.prototype.DayDiff = function(cDate,mode){
         try{
             cDate.getYear();
         }catch(e){
             return(0);
         }
         var base =60*60*24*1000;
         var result = Math.abs(this - cDate);
         switch(mode){
             case "y":
                 result/=base*365;
                 break;
             case "m":
                 result/=base*365/12;
                 break;
             case "w":
                 result/=base*7;
                 break;
             default:
                 result/=base;
                 break;
         }
         return(Math.floor(result));
     }

Test: alarm((new Date()).DayDiff((new Date(2002,0,1)))) -> Display 329
warning((new Date()).DayDiff((new Date(2002 ,0,1)),"m")) -> Anzeige 10

Natürlich kann es auch weiter erweitert werden, um die Reaktionsstunden, Minuten oder sogar Sekunden zu erhalten.

Das obige ist der detaillierte Inhalt vonDetaillierte Erklärung des Prototyps in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!