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.