Crashkurs – Variablen Code-Challenge (Chatbot – Teil 1)

In den nächsten zwei Übungen programmierst du einen einfachen Chatbot. Der Chatbot stellt dem Benutzer eine Frage. Der Benutzer antwortet auf die Frage mithilfe eines Textfeldes. Der Chatbot antwortet, nach Übermittlung der Benutzerdaten,  auf den eingegebenen Text des Benutzers.

Um Daten von Benutzern abzufragen, benötigst du den input()-Befehl. Mithilfe dieses Befehls werden deine Apps noch dynamischer.

Der input-Befehl funktioniert wie folgt:

input("Text", Funktion)

Erklärung des input()-Befehls

Wie du siehst, nimmt der input()-Befehl zwei Parameter entgegen, nämlich:

  1. einen anzuzeigenden "Text" für den Benutzer und
  2. eine Funktion (sogenannte Callback-Funktion), die ausgeführt wird, sobald der Benutzer seine Daten abgeschickt hat.

Nachstehend ein Beispiel zum input-Befehl. Probiere es selbst aus, indem du auf "Code Testen" klickst :

input("Wie heißt du?", nameAntwort)

// Die Funktion "nameAntwort" wird ausgeführt, sobald der Benutzer das Textfeld ausgefüllt und abgeschickt hat.
function nameAntwort(name) {
  
  // Begrüßt den Benutzer, mit den übermittelten Daten des input-Textfeldes
  output("Hallo " + name);
  
}
Code ausprobieren ×

Hinweis: Die Funktion, die du im 2. Parameter des input-Befehls angibst, muss bereits definiert sein, wenn du deinen Code ausführst. Wurde die Funktion noch nicht erstellt, bekommst du einen Fehler, da JavaScript die Funktion nicht findet.

Wenn du das selbst ausprobieren möchtest, lösche im obigen Beispiel alles, bis auf die erste Zeile. Wenn du deinen Code jetzt ausführst, erhältst du einen Fehler, da JavaScript die "nameAntwort"-Funktion nicht findet. 

Jetzt bist du gefragt:

Deine Aufgabe;

  1. Benutze den input-Befehl, um den Benutzer nach seinem Alter zu fragen.
  2. Definiere außerdem die Funktion alterAntwort
  3. Innerhalb der alterAntwort-Funktion soll das vom Benutzer eingegebene Alter mit dem output()-Befehl ausgegeben werden.
    1. Hinweis: Der output()-Befehl funktioniert genauso wie der ausgeben()-Befehl, hat jedoch einen farbigen Hintergrund hinter dem Text.

Wenn die Aufgabe zu schwer ist, schaue dir das obige Beispiel oder die untenstehende Lösung an.

[lp_spoiler title="Lösung anzeigen" style="simple"]

input("Wie alt bist du?", alterAntwort)

// Die Funktion "alterAntwort" wird ausgeführt, sobald der Benutzer das Textfeld ausgefüllt und abgeschickt hat.

function alterAntwort(alter) {
  // Begrüßt den Benutzer, mit den übermittelten Daten des input-Textfeldes
  output("Du bist " + alter + " Jahre alt.")
}

[/lp_spoiler]

Alles erledigt? In der nächsten Lektion geht es weiter mit dem Chatbot.