Methoden sind Funktionen, die Objekteigenschaften zugewiesen sind. Wenn eine Funktion in den Eigenschaften eines Objekts definiert ist, wird sie als Methode des Objekts und nicht als Funktion bezeichnet.
Attribute sind voreingestellte spezifische Informationen (Wert), denen ein Name (Attributname) hinzugefügt wird. In ihren Eigenschaften wird die Funktion konkret als „Methode“ bezeichnet.
Schauen wir uns ein konkretes Beispiel an
Im folgenden Programm erstellen wir ein Objekt basierend auf den Ampelfarben Blau, Gelb, Rot und fügen es ein eine Variable namens Traffic_light.
<!DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<title>So verwenden Sie Methoden in So verwenden Sie Methoden in So verwenden Sie Methoden in JavaScript</title>
</head>
<body>
<script>
var traffic_light = {
blue: "go",
yellow: "slow down",
red: "stop"
}
</script>
</body>
</html>Nach dem Login kopieren
Wir haben hier eine Eigenschaft namens „current“ hinzugefügt. Enthält die Farbe der aktuellen Ampel.
<script>
var traffic_light = {
blue: "go",
yellow: "slow down",
red: "stop", current: " "
}
</script>Nach dem Login kopieren
Die Funktion, die die Farbe der Ampel ändert, ist als change_light definiert. Ändern Sie dann den Wert dieses Stroms, indem Sie eine Methode (Funktion) namens change_light aufrufen.
Wir definieren zunächst die Funktion „change_light“
Um die Funktion weiterhin im obigen Programm zu verwenden, definieren wir die Funktion vorübergehend als „change_light“.
Betrachten wir das nächste Signal zum Aufrufen von change_light, um das Verhalten der nächsten aufzurufenden Eigenschaft zu bestimmen, je nachdem, was zu diesem Zeitpunkt aktuell ist.
Verwenden Sie die switch-Anweisung, um change_light auf vier Modi einzustellen.
Wenn das in aktuell enthaltene Attribut blau ist, wird das nächste Attribut in gelb geändert.
Wenn das in aktuell enthaltene Attribut gelb ist, wird das nächste Attribut in rot geändert.
Wenn das in aktuell enthaltene Attribut rot ist, wird das nächste Attribut in blau geändert.
Die Standardeinstellung ist blau.
<script>
var traffic_light = {
blue: "go",
yellow: "slow down",
red: "stop",
current: " "
}
function change_light(){
switch(traffic_light.current){
case traffic_light.blue:
traffic_light.current = traffic_light.yellow;
break;
case traffic_light.yellow:
traffic_light.current = traffic_light.red;
break;
case traffic_light.red:
traffic_light.current = traffic_light.blue;
break;
default:
traffic_light.current = traffic_light.blue;
break
}
}
</script>Nach dem Login kopieren
Überprüfen Sie als Nächstes die Ergebnisse, indem Sie „current“ in console.log aufrufen.
<script>
var traffic_light = {
blue: "go",
yellow: "slow down",
red: "stop",
current: " "
}
function change_light(){
switch(traffic_light.current){
case traffic_light.blue:
traffic_light.current = traffic_light.yellow;
break;
case traffic_light.yellow:
traffic_light.current = traffic_light.red;
break;
case traffic_light.red:
traffic_light.current = traffic_light.blue;
break;
default:
traffic_light.current = traffic_light.blue;
break
}
} change_light();
console.log(traffic_light.current);
</script>Nach dem Login kopieren
Da das Standardattribut auf „Blau“ gesetzt ist, ist der Ausgabe-Blauwert go.
Verwenden Sie console.log, um den Anruf dreimal zu wiederholen...
<script>
var traffic_light = {
blue: "go",
yellow: "slow down",
red: "stop",
current: " "
}
function change_light(){
switch(traffic_light.current){
case traffic_light.blue:
traffic_light.current = traffic_light.yellow;
break;
case traffic_light.yellow:
traffic_light.current = traffic_light.red;
break;
case traffic_light.red:
traffic_light.current = traffic_light.blue;
break;
default:
traffic_light.current = traffic_light.blue;
break
}
}
change_light();
console.log(traffic_light.current);
change_light();
console.log(traffic_light.current);
change_light();
console.log(traffic_light.current);
change_light();
console.log(traffic_light.current);
</script>Nach dem Login kopieren
aktuelle Änderungen von Blau->Gelb->Rot-> Die Ausgabe von ;blue
Wert ist go->slow down->stop->go
Lassen Sie uns zum Schluss einen Blick darauf werfen Sehen Sie sich die Verwendung der Methode an, die change_light als Traffic_light
macht. Was zu tun ist, ist, den Eigenschaftsnamen change_light nach current: „“ zu setzen und ihn mit der folgenden Funktion zu trennen (wie mit „: "trennen Sie sie). (Zu diesem Zeitpunkt wird der fortlaufende Funktionsname „change_light“ dupliziert, sodass er entfernt werden kann)
<script>
var traffic_light = {
blue: "go",
yellow: "slow down",
red: "stop",
current: " ",
change_light:function(){
switch(traffic_light.current){
case traffic_light.blue:
traffic_light.current = traffic_light.yellow;
break;
case traffic_light.yellow:
traffic_light.current = traffic_light.red;
break;
case traffic_light.red:
traffic_light.current = traffic_light.blue;
break;
default:
traffic_light.current = traffic_light.blue;
break
}
}
}
</script>Nach dem Login kopieren
Jetzt verfügt das teaffic_light-Objekt über eine Methode namens „change_light“.
Wir nennen es in consoe.log auf die gleiche Weise. Wiederholen Sie dies viermal.
Wenn Sie jede Eigenschaft in einem Objekt aufrufen, können Sie den Eigenschaftswert aufrufen, indem Sie „.“ in den Variablennamen gefolgt vom Eigenschaftsnamen einfügen. Wenn Sie also eine Methode (Eigenschaft) in dem in der Variablen Traffic_light enthaltenen Objekt aufrufen möchten, sieht das so aus.
<script>
var traffic_light = {
blue: "go",
yellow: "slow down",
red: "stop",
current: " ",
change_light:function() {
switch(traffic_light.current){
case traffic_light.blue:
traffic_light.current = traffic_light.yellow;
break;
case traffic_light.yellow:
traffic_light.current = traffic_light.red;
break;
case traffic_light.red:
traffic_light.current = traffic_light.blue;
break;
default:
traffic_light.current = traffic_light.blue;
break
}
}
}
traffic_light.change_light();
console.log(traffic_light.current);
traffic_light.change_light();
console.log(traffic_light.current);
traffic_light.change_light();
console.log(traffic_light.current);
traffic_light.change_light();
console.log(traffic_light.current);
</script>Nach dem Login kopieren
Die laufenden Ergebnisse sind wie folgt:
Das Ergebnis ändert sich nicht, da die Funktion change_light nur eine Methode des Traffic_light-Objekts ist.
Das obige ist der detaillierte Inhalt vonSo verwenden Sie Methoden in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
