Aufwärmen · Aufgabe 1 von 7
// B2.4 · ca. 30 Min. · Einstieg
Gleichheit und Selbigkeit
Nach dieser Lektion vergleichen Sie Werte mit === und !==, sagen vorher, was == bei verschiedenen Typen tut, prüfen richtig auf NaN und wissen, wann zwei Arrays oder zwei Strings als gleich oder kleiner gelten.
Danach können Sie
- Werte mit === und !== vergleichen und vorhersagen, was == bei verschiedenen Typen umwandelt
- NaN und -0 behandeln: Number.isNaN, und Object.is für Selbigkeit
- Arrays und Objekte per Referenz vergleichen, und Strings mit < und > im Unterschied zu Zahlen
Vorhersagen · Aufgabe 2 von 7
Sagen Sie es vorher, bevor Sie weiterlesen: Was gibt dieser Code aus?
console.log(1 == "1", 1 === "1");Üben · Aufgabe 3 von 7
NaN === NaN ist false. Ergänzen Sie den Methodennamen, sodass die Zeile auf Selbigkeit prüft und true ausgibt.
console.log(Object.____(NaN, NaN));console.log(Object.(NaN, NaN));Üben · Aufgabe 4 von 7
Was gibt dieser Code aus?
const a = [1, 2]; const b = [1, 2]; const c = a; console.log(a === b, a === c);Üben · Aufgabe 5 von 7
Ordnen Sie jedem Vergleich sein Ergebnis und den Grund zu.
Denksport · Aufgabe 6 von 7
Knobelaufgabe. Was gibt dieser Code aus?
console.log("10" < "9", 10 < 9, "10" < 9);Anwenden · Aufgabe 7 von 7
Kleine Aufgabe. Ein Formular liefert Ihnen den Text "42", und das Programm hat die Zahl 42 gespeichert. Geben Sie den losen Vergleich aus, den strikten und den strikten, nachdem Number() den Text umgewandelt hat. Wandeln Sie dann den Text "forty-two" um und geben Sie mit Number.isNaN aus, ob das Ergebnis NaN ist. Sagen Sie jede Zeile vorher, bevor Sie das Programm ausführen.
Prüfen Sie Ihr Ergebnis anhand dieser Liste
Selbst programmieren
Lesen Sie das ausgearbeitete Beispiel und lösen Sie dann die Übungen. Ihr Code läuft in Ihrem Browser oder auf Ihrem Computer und wird nie hochgeladen.
Ausgearbeitetes Beispiel
Ein Gleichheitslabor
Dieses Programm vergleicht dieselben Arten von Werten auf verschiedene Weise und gibt jede Frage mit ihrer Antwort aus, mit Template-Literalen. Es behandelt einen String gegenüber einer Zahl, ein NaN aus einer missglückten Umwandlung, zwei Arrays und Strings gegenüber Zahlen mit <. Führen Sie es aus, ändern Sie dann einen Wert, etwa typed in "7.0" oder copy in cart, und sagen Sie jede Zeile vorher, bevor Sie es erneut ausführen.
main.js
// The same values, compared in different ways.
const typed = "7";
const stored = 7;
console.log(`typed == stored: ${typed == stored}`);
console.log(`typed === stored: ${typed === stored}`);
console.log(`Number(typed) === stored: ${Number(typed) === stored}`);
const result = Number("seven");
console.log(`result === NaN: ${result === NaN}`);
console.log(`Number.isNaN(result): ${Number.isNaN(result)}`);
console.log(`Object.is(result, NaN): ${Object.is(result, NaN)}`);
const cart = ["tea", "milk"];
const sameCart = cart;
const copy = ["tea", "milk"];
console.log(`cart === sameCart: ${cart === sameCart}`);
console.log(`cart === copy: ${cart === copy}`);
console.log(`cart[0] === copy[0]: ${cart[0] === copy[0]}`);
console.log(`"10" < "9": ${"10" < "9"}`);
console.log(`10 < 9: ${10 < 9}`);
Ausführen mit
node main.jsAusgabe
typed == stored: true
typed === stored: false
Number(typed) === stored: true
result === NaN: false
Number.isNaN(result): true
Object.is(result, NaN): true
cart === sameCart: true
cart === copy: false
cart[0] === copy[0]: true
"10" < "9": true
10 < 9: false- == sagt, der Text "7" sei gleich der Zahl 7; === sagt nein, und Number() macht den strikten Vergleich true.
- result === NaN ist false, obwohl result NaN ist: Prüfen Sie NaN mit Number.isNaN oder Object.is.
- sameCart ist dasselbe Array wie cart; copy sieht nur gleich aus. Der Vergleich der Elemente vergleicht die Strings darin.
- Als Text kommt "10" vor "9"; als Zahl nicht.
Ändern und ausführen
Tab rückt ein, Umschalt+Tab rückt aus. Um den Editor mit der Tastatur zu verlassen, drücken Sie Esc und dann Tab.
Beim ersten Ausführen lädt Ihr Browser den JavaScript-Runner herunter (bis zu 0.1 MB) und speichert ihn im Cache. Ihr Code läuft in der eigenen Engine Ihres Browsers und bleibt auf Ihrem Gerät.
Übungen
Übung 1 von 2
Keine versteckten Umwandlungen
Das Programm vergleicht eine eingegebene PIN mit einer gespeicherten und zwei weitere Werte, mit == und !=. Die ersten drei Prüfungen geben true aus, aber jede vergleicht Werte verschiedener Typen, sie sollten also false ausgeben, und die letzte sollte true ausgeben. Ändern Sie die Operatoren in === und !==, damit nichts umgewandelt wird. Ändern Sie die Werte nicht.
Tab rückt ein, Umschalt+Tab rückt aus. Um den Editor mit der Tastatur zu verlassen, drücken Sie Esc und dann Tab.
Beim ersten Ausführen lädt Ihr Browser den JavaScript-Runner herunter (bis zu 0.1 MB) und speichert ihn im Cache. Ihr Code läuft in der eigenen Engine Ihres Browsers und bleibt auf Ihrem Gerät.
Hinweise
Hinweis 1
Führen Sie es zuerst aus: == wandelt "0042" in die Zahl 42 und "" in 0 um, bevor es vergleicht.
Hinweis 2
Ersetzen Sie jedes == durch ===. Die strikte Variante prüft auch den Typ.
Hinweis 3
Die letzte Prüfung fragt, ob die beiden sich unterscheiden: Aus != wird !==.
Eine Lösung zeigen
Ein möglicher Lösungsweg. Ihrer kann anders aussehen und trotzdem alle Prüfungen bestehen.
const typedPin = "0042";
const storedPin = 42;
const input = "";
const answer = "1";
console.log("PIN matches:", typedPin === storedPin);
console.log("input is zero:", input === 0);
console.log("answer is true:", answer === true);
console.log("PIN differs:", typedPin !== storedPin);
Auf dem eigenen Computer ausführen
Installieren Sie ECMAScript 2026 oder neuer. Speichern Sie diese Dateien in einem Ordner, öffnen Sie dort ein Terminal und führen Sie die Befehle unten aus.
main.js
const typedPin = "0042";
const storedPin = 42;
const input = "";
const answer = "1";
console.log("PIN matches:", typedPin == storedPin);
console.log("input is zero:", input == 0);
console.log("answer is true:", answer == true);
console.log("PIN differs:", typedPin != storedPin);
main.test.js
import {test} from 'node:test';
import assert from 'node:assert/strict';
import {runMain} from './learnrun.js';
const lines = async () => (await runMain()).trimEnd().split('\n');
test('gibt vier Zeilen aus', async () => {
const got = await lines();
assert.equal(got.length, 4, `das Programm gab ${got.length} Zeile(n) aus, erwartet: 4`);
});
test('die PIN passt ohne Umwandlung nicht', async () => {
const got = await lines();
assert.equal(got[0], 'PIN matches: false', `die erste Zeile ist ${JSON.stringify(got[0])}, erwartet: "PIN matches: false"`);
});
test('die leere Eingabe ist nicht null', async () => {
const got = await lines();
assert.equal(got[1], 'input is zero: false', `die zweite Zeile ist ${JSON.stringify(got[1])}, erwartet: "input is zero: false"`);
});
test('der Text "1" ist nicht der Wert true', async () => {
const got = await lines();
assert.equal(got[2], 'answer is true: false', `die dritte Zeile ist ${JSON.stringify(got[2])}, erwartet: "answer is true: false"`);
});
test('die PIN unterscheidet sich strikt', async () => {
const got = await lines();
assert.equal(got[3], 'PIN differs: true', `die vierte Zeile ist ${JSON.stringify(got[3])}, erwartet: "PIN differs: true"`);
});
package.json
{
"type": "module"
}
package.json sagt Node.js, dass die .js-Dateien Module sind; lassen Sie die Datei im Ordner.
Programm ausführen:
node main.jsPrüfungen ausführen (learnrun.js muss im selben Ordner liegen):
node --testlearnrun.js herunterladenÜbung 2 von 2
Drei falsche Antworten
Jede Zeile dieses Programms gibt die falsche Antwort aus, und kein Fehler hilft Ihnen dabei. Es soll price is NaN: true ausgeben, dann same basket: true, dann 10 is less than 9: false. Korrigieren Sie die NaN-Prüfung, machen Sie saved zu genau demselben Array wie basket statt zu einer Kopie, und vergleichen Sie die beiden Texte mit Number() als Zahlen. Lassen Sie die Beschriftungen, wie sie sind.
Tab rückt ein, Umschalt+Tab rückt aus. Um den Editor mit der Tastatur zu verlassen, drücken Sie Esc und dann Tab.
Beim ersten Ausführen lädt Ihr Browser den JavaScript-Runner herunter (bis zu 0.1 MB) und speichert ihn im Cache. Ihr Code läuft in der eigenen Engine Ihres Browsers und bleibt auf Ihrem Gerät.
Hinweise
Hinweis 1
NaN ist mit nichts gleich, auch nicht mit sich selbst, also ist price === NaN immer false. Number.isNaN(price) stellt die richtige Frage.
Hinweis 2
Zwei Array-Klammern erzeugen zwei Arrays. const saved = basket; lässt saved auf dasselbe zeigen.
Hinweis 3
Zwei Strings werden Zeichen für Zeichen verglichen. Number(small) < Number(large) vergleicht 10 und 9.
Eine Lösung zeigen
Ein möglicher Lösungsweg. Ihrer kann anders aussehen und trotzdem alle Prüfungen bestehen.
const price = Number("12,50");
console.log("price is NaN:", Number.isNaN(price));
const basket = ["apple", "pear"];
const saved = basket;
console.log("same basket:", basket === saved);
const small = "10";
const large = "9";
console.log("10 is less than 9:", Number(small) < Number(large));
Auf dem eigenen Computer ausführen
Installieren Sie ECMAScript 2026 oder neuer. Speichern Sie diese Dateien in einem Ordner, öffnen Sie dort ein Terminal und führen Sie die Befehle unten aus.
main.js
const price = Number("12,50");
console.log("price is NaN:", price === NaN);
const basket = ["apple", "pear"];
const saved = ["apple", "pear"];
console.log("same basket:", basket === saved);
const small = "10";
const large = "9";
console.log("10 is less than 9:", small < large);
main.test.js
import {test} from 'node:test';
import assert from 'node:assert/strict';
import {runMain} from './learnrun.js';
const lines = async () => (await runMain()).trimEnd().split('\n');
test('findet das NaN', async () => {
const got = await lines();
assert.equal(got[0], 'price is NaN: true', `die erste Zeile ist ${JSON.stringify(got[0])}, erwartet: "price is NaN: true"`);
});
test('saved ist dasselbe Array wie basket', async () => {
const got = await lines();
assert.equal(got[1], 'same basket: true', `die zweite Zeile ist ${JSON.stringify(got[1])}, erwartet: "same basket: true"`);
});
test('vergleicht 10 und 9 als Zahlen', async () => {
const got = await lines();
assert.equal(got[2], '10 is less than 9: false', `die dritte Zeile ist ${JSON.stringify(got[2])}, erwartet: "10 is less than 9: false"`);
});
test('gibt genau drei Zeilen aus', async () => {
const got = await lines();
assert.equal(got.length, 3, `das Programm gab ${got.length} Zeile(n) aus, erwartet: 3`);
});
package.json
{
"type": "module"
}
package.json sagt Node.js, dass die .js-Dateien Module sind; lassen Sie die Datei im Ordner.
Programm ausführen:
node main.jsPrüfungen ausführen (learnrun.js muss im selben Ordner liegen):
node --testlearnrun.js herunterladenHäufige Fehler
Ein einzelnes = statt ===
const total = 10;
console.log(total = 10);
Was Node.js ausgibt
TypeError: Assignment to constant variable.Warum, und die Lösung
Ein = weist einen Wert zu; es vergleicht nicht. Hier versucht es, der Konstante total einen neuen Wert zu geben, und das Programm stoppt. Mit einer let-Variable wäre es schlimmer: Der Wert würde sich ohne jeden Fehler ändern, und die Zeile gäbe 10 aus. Zum Vergleichen schreiben Sie total === 10.
Ein kleines n in Number.isNaN
const result = Number("abc");
console.log(Number.isNan(result));
Was Node.js ausgibt
TypeError: Number.isNan is not a functionWarum, und die Lösung
Number gibt es, aber es hat keine Methode isNan: Der Name ist isNaN, mit großem N an beiden Enden, wie der Wert NaN. Namen unterscheiden Groß- und Kleinschreibung, und der Aufruf eines Namens, der keine Funktion ist, ist ein TypeError. Schreiben Sie Number.isNaN(result).
Vier Gleichheitszeichen
const x = 5;
console.log(x ==== 5);
Was Node.js ausgibt
SyntaxError: Unexpected token '='Warum, und die Lösung
JavaScript kennt ==, === und ihre Gegenstücke != und !==, aber kein ==== und kein !===. Nach === kann das nächste = nichts beginnen, also kann die Datei nicht gelesen werden, und keine Zeile läuft. Verwenden Sie für strikte Gleichheit genau drei Zeichen: x === 5.
JavaScript im Browser: die eigene Engine Ihres Browsers in einem abgeschotteten Worker. Syntaxfehler findet acorn 8.18.0, MIT. Lizenz und Quellcode
Abschlussquiz
5 Fragen, ohne Hinweise. Ab 80 % ist die Lektion abgeschlossen.
Erledigen Sie zuerst alle Aufgaben oben, um das Abschlussquiz freizuschalten.