MMProg:WiSe2014:Praktikum:Probeprüfung

MMProg Probeprüfung WiSe 2014/2015

Anmerkung: Die Probeprüfung bildet nur den ersten Teil des tatsächlichen Prüfungspraktikums ab. Der zweite Teil besteht darin ein Spiel zu vervollständigen, welches nach dem MVC-Paradigma programmiert wurde. Der Aufbau der Aufgabe orientiert sich stark an den Praktikumsaufgaben, insbesondere Aufgaben 5, 6 und 7.

Teil 1

Vorbereitung

Speichern Sie zunächst die für die Probeprüfung notwendigen Dateien auf Ihrem Rechner ab.

Bearbeiten Sie die nachfolgenden Aufgaben, indem Sie ausschliesslich die Datei "index.js" entsprechend modifizieren. Fügen Sie den Code für die einzelnen Aufgaben der Übersichtlichkeit halber immer nach den zugehörigen Kommentaren ein.

Nutzen Sie die in der Datei "log.js" definierte global verfügbare Funktion log() um Ihre Nachrichten auszugeben. Öffnen Sie zu gegebenen Zeitpunkten die Datei "index.html" im Browser um die Korrektheit Ihres Codes zu überprüfen.

Aufgabe 1

Geben Sie den String "MMProg Probeprüfung WiSe 2014/2015" (ohne Anführungszeichen) aus.

Aufgabe 2

Erzeugen Sie die Variable "reason" und weisen Sie ihr den String "Vorbereitung auf die Prüfung" als Wert zu. Geben Sie dann die zuvor erzeugte Variable "reason" aus, vorangestellt durch die Zeichenkette "Zweck: ".

Aufgabe 3

Erzeugen Sie die Variable "room" und weisen Sie dieser ein Objekt mit den folgenden Eigenschaften zu:

• Name: building, Wert: "M"
• Name: floor, Wert: 3
• Name: number, Wert: 2

Geben Sie dann die Eigenschaften aus in der Reihenfolge "building", "floor", "number", wobei nach "floor" ein Punkt stehen soll.

Aufgabe 4

Erzeugen Sie die Variable "topics" und weisen Sie ihr ein dreistelliges Array zu mit den Werten "Variablen", "Objekte" und "Funktionen".

Geben Sie zunächst die Länge des Arrays "topics" aus, vorangestellt durch den String "Anzahl der Themen: ". Geben Sie außerdem noch das erste Element des Arrays aus, vorangestellt durch den String "Erstes Thema: ".

Aufgabe 5

Erzeugen Sie eine Funktion namens "formatRoomNumber" welche eine Raumnummer für die Anzeige entsprechend formatieren soll. Die Funktion akzeptiert ein numerisches Argument namens "roomNumber" und gibt die formatierte Nummer als String zurück.

Folgende Logik soll dazu implementiert werden:

• Ist die Zahl kleiner als 10, wird die Kombination aus dem String "0" und dem String-Wert der Zahl zurückgegeben
• Ist die Zahl größer/gleich als 10, wird ihr String-Wert zurükgegeben

Tipp: Sie können auf einer Variable die Funktion toString() aufrufen um ihren String-Wert zu erhalten.

Beispielausgaben:

• 2 => "02"
• 10 => "10"

Aufgabe 6

In dieser Aufgabe sollen Sie eine Prüfung mit zwei Aufgaben als stark vereinfachtes Objektmodell abgebildet werden.

Erzeugen Sie zunächst die Objekte "exerciseObject1" und "exerciseObject1" mit den Eigenschaften "task" und "solution".

Objekt 1 erhält folgende String-Werte:

• "task" => "Define the variable 'greeting' with value 'Hello World'"
• "solution" => "var greeting = 'Hello World';"

Objekt 2 erhält folgende String-Werte:

• "task" => "Define the array 'numbers' with the values 1, 2, 3"
• "solution" => "var numbers = [1, 2, 3];"

Erzeugen Sie dann das Objekt "examObject" welches die beiden Eigenschaften "title" und "exercises" erhält. "title" wird mit dem Wert "Probeprüfng" belegt, "exercises" mit einem Array welches die beiden Aufgaben-Objekte enthält.

Das Prüfungsobjekt erhält außerdem eine Funktion namens "getTasks", welche ein neues Array erzeugt, dieses mit der Eigenschaft "task" aller enthaltenen Aufgaben befüllt und das Array zurückgibt. Dabei gilt es die Funktion so zu implementieren, dass sie immer korrekt funktioniert, unabhängig davon wieviele und welche Aufgaben das Prüfungsobjekt aktuell enthält.

Rufen Sie die Funktion "getTasks" des Prüfungsobjekts auf und geben Sie das Ergebnis mit der log()-Funktion aus. Die Ausgabe sollte in diesem Fall aus einem Array mit zwei String-Einträgen bestehen.

Aufgabe 7

In dieser Aufgabe sollen Sie den oben beschriebenen Sachverhalt nun mithilfe von Konstruktorfunktionen abbilden. Dabei gilt es eine Konstruktorfunktion namens "Exercise" und eine namens "Exam" zu implementieren. "Exercise" akzeptiert die Argumente "task" und "solution" und weist diese der jeweiligen Instanz zu. "Exam" akzeptiert die beiden Argumente "title" und "exercises" und weist diese ebenso der jeweiligen Instanz zu.

"Exam" weist der erzeugten Instanz auch eine Funktion "getTasks" zu, welche sich genauso wie oben beschrieben verhält.

Erzeugen Sie dann mittels dem "Exercise"-Konstruktor die beiden Objekte "exerciseInstance1" und "exerciseInstance2". "exerciseInstance1" erhält die gleichen Werte wie "exerciseObject1", "exerciseInstance2" wie "exerciseObject2".

Erzeugen Sie mittels dem "Exam"-Konstruktor das Objekt "examInstance" als Pendant zu "examObject".

Rufen Sie die Funktion "getTasks" ebenso auf der erzeugten Instanz auf und geben Sie die Rückgabewerte aus. Die Ausgabe sollte in diesem Fall aus einem Array mit zwei String-Einträgen bestehen.

Aufgabe 8

Suchen Sie im ersten Schritt das DOM-Element mit der Klasse "messages" aus dem aktuellen Dokument. Weisen Sie dessen CSS-Objektmodell dann als Hintergrundfarbe den Wert "#EEE" zu.

Wenn Sie die Seite nun im Browser betrachten sollten die ausgegebenen Nachrichten leicht grau hinterlegt sein.

Aufgabe 9

Erzeugen Sie eine Variable namens "pastSeconds" und initialisieren Sie diese mit dem Wert 0. Erzeugen Sie die Funktion "updateAndLogPastSeconds", welche die Variable "pastSeconds" um eins erhöht und deren aktuellen Wert vorangestellt durch den String "Vergangene Sekunden" ausgibt.

Erzeugen Sie dann einen *geeigneten* und sich wiederholenden Timer welcher ungefähr jede Sekunde die Funktion aufruft. Begründen Sie kurz in einem Code-Kommentar warum die Ausgabe der vergangenen Sekunden nie ganz korrekt sein wird.

Aufgabe 10

Erzeugen Sie einen globalen Event-Listener für das "keyup"-Event auf dem document-Objekt. In der Callback-Funktion soll überprüft werden ob der "keycode" des Events den Wert 32 besitzt. Ist dies der Fall, so soll die Variable "pastSeconds" wieder auf 0 zurückgesetzt werden und die Nachricht "Timer wurde zurückgesetzt" mithilfe von log() ausgegeben werden.

Musterlösung

Vergleichen Sie Ihre Lösungen der Aufgaben mit der Musterlösung.