Heim  >  Artikel  >  Computer-Tutorials  >  Wie definiert JavaScript eine hide-ähnliche Methode, die mit einem Klick aufgerufen werden kann?

Wie definiert JavaScript eine hide-ähnliche Methode, die mit einem Klick aufgerufen werden kann?

PHPz
PHPznach vorne
2024-01-13 12:12:05923Durchsuche

Wie definiert Javascript die angeklickte Methode ähnlich wie beim Aufruf durch hide

Prototyp-Methode. . . . Prototyp

Definieren Sie beispielsweise eine Funktion für das Array Array

Array.prototype.in_array = function ($string) { for (var i = 0; i

{

for (i = 0; i

true zurückgeben;

}

}

false zurückgeben;

}

Man kann es einfach nennen

var a = neues Array('a');

a.in_array('a');

Überprüfen Sie, ob es existiert

In z.B. String

String.prototype.trim = function()

{

return this.replace(/^s*|s*$/g, '');

}

Man kann es einfach nennen

var a = 'abcdefg';

a.trime();

Dadurch werden die Leerzeichen auf beiden Seiten entfernt

Das Gleiche gilt für benutzerdefinierte Funktionen. Erstellen Sie zunächst eine Funktion und verwenden Sie einen Prototyp, um Methoden hinzuzufügen.

Wie können Objekte in JavaScript definiert werden?

Mehrere Möglichkeiten, Javascript-Objekte zu definieren

1. Factory-Methode: Erstellen Sie zuerst das Objekt und fügen Sie dann Methoden und Eigenschaften zum Objekt hinzu. Vermeiden Sie nach dem Schließen die Verwendung des neuen Operators zum Erstellen von Objekten. Obwohl dieser Ansatz einige Nachteile hat, wird beispielsweise beim Definieren einer Methode innerhalb einer Factory-Funktion bei jedem Aufruf eine neue Funktion erstellt.

Funktionsfabrik (Name, Person, Adresse, Zeit){

var tmp=neues Objekt;

tmp.name=name;

tmp.person=person;

tmp.address=adresse;

tmp.workTime=function(){

alert("Die Zeit, zu der wir mit der Arbeit beginnen" + Zeit);

}

return tmp;

}

Var Fabrik1 = Fabrik("Drogen", 100, "Huashan Rd", 10);

var Factory2 = Factory("TCMdrugs", 100, "hongqiao Rd", 11);

factory1.workTime();

factory2.workTime();//Hier haben Factory1 und Factory2 unterschiedliche Methoden

Obwohl dieses Problem auf folgende Weise behoben werden kann, mangelt es an einer guten Kapselung

Funktionsfabrik (Name, Person, Adresse, Zeit){

var tmp=neues Objekt;

tmp.name=name;

tmp.person=person;

tmp.address=adresse;

tmp.workTime=workTime();

return tmp;

}

Funktion workTime(){

alert("Die Zeit, in der wir mit der Arbeit beginnen" + this.time);

}

2. Die Konstruktormethode bedeutet, dass das Schlüsselwort this im Konstruktor verwendet wird, um ein Objekt zu erstellen. Bei der Verwendung muss es über den neuen Operator instanziiert werden. Diese Methode hat jedoch das gleiche Problem wie die Factory-Methode, d. h. bei jedem Aufruf des Konstruktors wird ein neues Funktionsobjekt erstellt, was zu einer wiederholten Erstellung der Funktion führt.

Funktionskonstrukt (Name, Person, Adresse, Zeit) { //Schreiben Sie hier Ihre Codelogik }

dieser.name=name;

diese.person=person;

this.address=Adresse;

this.workTime=function(){

alert("Die Zeit, in der wir mit der Arbeit beginnen" + this.time);

};

}

3. Prototyp-Methode: Verwenden Sie das Prototyp-Attribut, um Attribute und Methoden zu implementieren. Sie können den Objekttyp über die Instanz überprüfen, wodurch das Problem der wiederholten Erstellung von Funktionen gelöst wird. Es ist jedoch zu beachten, dass Eigenschaften nicht durch die Übergabe von Parametern initialisiert werden können.

Funktion Car(){

}

Car.prototype.color = "rot";

Car.prototype.doors = 4;

Car.prototype.mpg = 23;

Car.prototype.showColor = function() {

alert(this.color);

};

var car1 = neues Auto();

var car2 = neues Auto();

Aber wenn Sie auf die folgende Situation stoßen, geht wieder etwas schief

Car.prototype.drivers = ["mike", "sue"];

car1.drivers.push("matt");

alert(car1.drivers); //Ausgabe „mike,sue,matt“

alert(car2.drivers); // Ausgabe „mike, sue, matt“

Treiber sind Zeiger auf Array-Objekte, und beide Instanzen von Car verweisen auf dasselbe Array.

4. Gemischte Konstruktor-/Prototyp-Methode: Lösung zur Prototyp-Methode

Funktionsauto (sColor, iDoors, iMpg) { this.color = sColor; this.doors = iDoors; this.mpg = iMpg; }

this.color = sColor;

this.doors = iDoors;

this.mpg = iMpg;

this.drivers = ["mike", "sue"];

}

Car.prototype.showColor = function () { // dein Code }

alert(this.color);

};

var car1 = neues Auto("red", 4, 23);

var car2 = neues Auto("blau", 3, 25);

car1.drivers.push("matt");

alert(car1.drivers);

alert(car2.drivers);

5. Dynamische Prototypenmethode: Dies ist eine sehr empfehlenswerte Methode. Sie vermeidet die Probleme, die bei den vorherigen Methoden auftreten, und bietet einen benutzerfreundlicheren Codierungsstil.

Funktionsauto (sColor, iDoors, iMpg) { this.color = sColor; this.doors = iDoors; this.mpg = iMpg; }

this.color = sColor;

this.doors = iDoors;

this.mpg = iMpg;

this.drivers = ["mike", "sue"];

if(typeof Car.initialized == "undefiniert"){

Car.prototype.showColor = function () { // dein Code }

alert(this.color);

};

Car.initialized = true;

}

}

var car1 = neues Auto("red", 4, 23);

var car2 = neues Auto("blau", 3, 25);

car1.drivers.push("matt");

alert(car1.drivers);

alert(car2.drivers);

6. Gemischte Factory-Methode: Sie ähnelt der Factory-Methode, verwendet jedoch das neue Schlüsselwort zur Instanziierung. Obwohl sie die gleichen Nachteile wie die Werksmethode hat, wird sie nicht empfohlen.

Das obige ist der detaillierte Inhalt vonWie definiert JavaScript eine hide-ähnliche Methode, die mit einem Klick aufgerufen werden kann?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:docexcel.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen