MMProg:WiSe2015:Praktikum:Aufgabe 2
Praktikumsaufgabe 2
Vertiefung der JavaScript-Grundlagen
Ziel
Ziel dieser Aufgabe ist es eine bestehende JavaScript-Logger-Anwendung zu erweitern.
Projekt vorbereiten
Anmerkung: Es ist fortan nicht notwendig Subversion über die Kommandozeile zu bedienen. Nutzen Sie dazu einfach WebStorm oder alternativ TortoiseSVN bzw. svnX.
Stellen Sie sicher, dass Sie die Praktikumsvorlagen auf Ihrem Rechner gespeichert haben. Folgen Sie dazu der Anleitung aus Teil 1 der 1. Praktikumsaufgabe.
Legen Sie ein neues Verzeichnis "aufgabe2" innerhalb Ihres Repository-Verzeichnisses an. Kopieren Sie die aus dem Lehrveranstaltung-Repository im Ordner "aufgabe2/vorlage" enthaltenen Dateien in das Verzeichnis.
Log-Funktion verwenden
Wie im zweiten Teil der ersten Aufgabe wird bei dieser Aufgabe eine Logger-Funktion zur Verfügung gestellt. Diese Funktion wurde aus Gründen der Modularisierung in die eigene Datei "log.js" ausgelagert. Öffnen Sie diese Datei und machen Sie sich zunächst mit dem Code vertraut.
Versuchen Sie nun herauszufinden, welche Ausgaben die einzelnen folgenden Code-Blöcke verursachen. Validieren Sie Ihre Annahmen, indem Sie den Code in die "index.js" kopieren und die Seite "index.html" im Browser aufrufen.
log(spielerName1);
var spielerName1 = 'Paul';
var spielerName2 = 'Peter';
log(spielerName2);
window.spielerName3 = 'Hans';
log(spielerName3);
var punktzahl1;
log(punktzahl1);
var punktzahl2 = 100 / 'a';
log(punktzahl2);
var punktzahl3 = 017;
log(punktzahl3);
log(1.000 == 1);
var begruessung = 'Hallo Spieler!' + ' ' + 'Start in ' + 5 + ' Sekunden';
log(begruessung);
Log-Funktion erweitern
Im Folgenden geht es darum die Funktion log()
in der Datei "log.js" zu erweitern.
Platzieren Sie Ihren Code direkt am Anfang der Funktion bevor der Wert von message
in die Seite eingefügt wird.
Leerer String
Die Ausgabe des Loggers ist bei leeren Zeichenketten nicht besonders aussagekräftig. Erweitern Sie den Code so, dass anstelle von leeren Zeichenketten der String "(empty string)" ausgegeben wird.
Validieren Sie die Funktionalität, indem Sie in der "index.js" log()
mit einem leeren String aufrufen.
Booleans, Null und Undefined
Auch bei den boolschen Werten true
und false
sowie null
und undefined
kann die Ausgabe missverständlich sein.
Können Sie sich denken warum?
Erweitern Sie den Code wie folgt:
- handelt es sich um einen boolschen Wert soll die Zeichenkette "(boolean)" angehängt werden
- handelt es sich um Null soll die Zeichenkette "(null)" angehängt werden
- handelt es sich um Undefined soll die Zeichenkette "(undefined)" angehängt werden
Validieren Sie die Funktionalität, indem Sie in der "index.js" log()
mit den entsprechenden Werten aufrufen.
Aktuelles Datum
Bei Log-Nachrichten ist es immer sinnvoll zu wissen zu welchem Zeitpunkt diese erstellt wurden.
Mithilfe des Ausdrucks new Date()
bekommen Sie ein Datumsobjekt welches das aktuelle Datum vorhält.
Erweitern Sie die Log-Funktion so, dass vor jeder Nachricht das aktuelle Datum mit ausgegeben wird.