Testen Sie Ihre Fähigkeiten: Variablen

Zunächst bieten wir Ihnen eine unterhaltsame, interaktive Variablen-Herausforderung, erstellt von unserem Lernpartner, Scrimba.

Schauen Sie sich die eingebettete Lernsequenz an und führen Sie die Aufgabe auf der Timeline (das kleine Geistersymbol) aus, indem Sie den Anweisungen folgen und den Code bearbeiten. Wenn Sie fertig sind, können Sie die Lernsequenz fortsetzen, um zu überprüfen, wie die Lösung des Lehrers mit Ihrer übereinstimmt.

Um diese Aufgabe abzuschließen:

1. Klicken Sie auf "Play" im Codeblock unten, um das Beispiel im MDN Playground zu bearbeiten.
2. Fügen Sie eine neue Zeile hinzu, um den im vorhandenen myName-Variable gespeicherten Wert auf Ihren eigenen Namen zu korrigieren.

Wenn Sie einen Fehler machen, können Sie Ihre Arbeit mit der Zurücksetzen-Schaltfläche im MDN Playground löschen. Wenn Sie wirklich feststecken, können Sie die Lösung unterhalb der Live-Ausgabe ansehen.

<section></section>

* {
  box-sizing: border-box;
}

p {
  color: purple;
  margin: 0.5em 0;
}

let myName = "Paul";

// Don't edit the code above here!

// Add your code here

// Don't edit the code below here!

const section = document.querySelector("section");
const para = document.createElement("p");
para.textContent = myName;
section.appendChild(para);

// ...
// Don't edit the code above here!

myName = "Chris";

// Don't edit the code below here!
// ...

Die letzte Aufgabe für jetzt — in diesem Fall wird Ihnen ein vorhandener Code zur Verfügung gestellt, der zwei Fehler enthält. Das Ergebnisfenster sollte den Namen Chris ausgeben und eine Aussage darüber, wie alt Chris in 20 Jahren sein wird.

Um diese Aufgabe abzuschließen:

1. Klicken Sie auf "Play" im Codeblock unten, um das Beispiel im MDN Playground zu bearbeiten.
2. Beheben Sie das Problem und korrigieren Sie die Ausgabe.

Wenn Sie einen Fehler machen, können Sie Ihre Arbeit mit der Zurücksetzen-Schaltfläche im MDN Playground löschen. Wenn Sie wirklich feststecken, können Sie die Lösung unterhalb der Live-Ausgabe ansehen.

// Fix the following code

const myName = "Default";
myName = "Chris";

let myAge = "42";

// Don't edit the code below here!

const section = document.querySelector("section");
const para1 = document.createElement("p");
const para2 = document.createElement("p");
para1.textContent = myName;
para2.textContent = `In 20 years, I will be ${myAge + 20}`;
section.appendChild(para1);
section.appendChild(para2);

// Turn the const into a let, so the value can be changed
let myName = "Default";
myName = "Chris";

// myAge needs to have a number datatype
let myAge = 42;

// Don't edit the code below here!
// ...