MINT lernen

JavaScript und die Konsole

Zwei Textaufgaben mit Hinweisen und Erwartungshorizont — Ausgaben vorhersagen und eine leere Seite zum Laufen bringen.

Dein Fortschritt:
0 / 0 Aufgaben
1

Kosten der Klassenfahrt

AFB I–II

Für die Klassenfahrt schreibt Paul ein kleines Programm und bindet es in seine Seite ein:

console.log("Klassenfahrt");
console.log(28 * 45);
console.log("Kosten: " + 28 * 45 + " Euro");
  1. Beschreibe, wie Paul die Ausgaben seines Programms sichtbar macht.
  2. Gib die drei Zeilen an, die in der Konsole erscheinen.
  3. Erkläre, warum in der dritten Zeile gerechnet und nicht „2845“ angehängt wird.

Hinweise

Hinweis zu Aufgabe a)
Die Ausgaben erscheinen nicht auf der Seite selbst.
Hinweis zu Aufgabe b)
Rechne 28 · 45.
Hinweis zu Aufgabe c)
Punktrechnung vor Strichrechnung gilt auch hier.

Erwartungshorizont

Erwartungshorizont zu Aufgabe a)

Seite im Browser öffnen, mit F12 (Mac: ⌥ + ⌘ + J) die Entwicklerwerkzeuge öffnen und den Reiter „Konsole“ wählen.

Erwartungshorizont zu Aufgabe b)

Klassenfahrt · 1260 · Kosten: 1260 Euro

Erwartungshorizont zu Aufgabe c)

Zuerst wird 28 * 45 ausgewertet, weil * stärker bindet als +. Das Ergebnis 1260 ist eine Zahl; erst danach wird es mit den Texten verkettet: "Kosten: " + 1260 + " Euro".

2

Leas leere Seite

AFB II–III

Lea öffnet ihre Seite. Die Überschrift ist zu sehen, aber in der Konsole steht keine ihrer Ausgaben, sondern:

Im Ordner liegt die Datei app.js. Nachdem Lea den Fehler behoben hat, erscheint:

console.log("Wetter-App");
console.log("Heute: 18 Grad);
console.log("Morgen: 21 Grad");
  1. Deute die erste Meldung und gib an, was Lea in index.html ändern muss.
  2. Überprüfe app.js und erkläre, warum nicht einmal „Wetter-App“ ausgegeben wird.
  3. Entwickle ein Vorgehen in drei Schritten, mit dem man eine Seite prüft, bei der „nichts passiert“.

Hinweise

Hinweis zu Aufgabe a)
Vergleiche den Dateinamen in der Meldung mit dem im Ordner.
Hinweis zu Aufgabe b)
Ein Syntaxfehler wird entdeckt, bevor die erste Zeile läuft.
Hinweis zu Aufgabe c)
Denke an Speichern, Neuladen und die Konsole.

Erwartungshorizont

Erwartungshorizont zu Aufgabe a)

Die Datei App.js wird nicht gefunden: Im src steht großes A, die Datei heißt app.js. Richtig: <script src="app.js"></script>.

Erwartungshorizont zu Aufgabe b)

In Zeile 2 fehlt das schließende Anführungszeichen: console.log("Heute: 18 Grad");. Weil die Datei so nicht gelesen werden kann (Syntaxfehler), startet das Programm gar nicht — auch Zeile 1 läuft nicht.

Erwartungshorizont zu Aufgabe c)

Zum Beispiel: 1. Dateien speichern und Seite neu laden. 2. Konsole öffnen und die erste rote Meldung lesen (Dateiname, Zeilennummer). 3. Die genannte Zeile auf Tippfehler prüfen (Anführungszeichen, Klammern, Groß-/Kleinschreibung) oder mit console.log("bis hier") eingrenzen, wo das Programm stehen bleibt.