Zum Inhalt springen
aviral gupta

// 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.

Lektion 4 von 5 in B2 Grammatik, Typen und Operatoren

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
  1. Aufwärmen · Aufgabe 1 von 7

    Zum Aufwärmen: Welcher Operator prüft, ob zwei Werte gleich sind, ohne einen von ihnen umzuwandeln?

  2. Vorhersagen · Aufgabe 2 von 7

    Sagen Sie es vorher, bevor Sie weiterlesen: Was gibt dieser Code aus?

    console.log(1 == "1", 1 === "1");
  3. Ü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));
  4. Ü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);
  5. Üben · Aufgabe 5 von 7

    Ordnen Sie jedem Vergleich sein Ergebnis und den Grund zu.

  6. Denksport · Aufgabe 6 von 7

    Knobelaufgabe. Was gibt dieser Code aus?

    console.log("10" < "9", 10 < 9, "10" < 9);
  7. 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.js

Ausgabe

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
  1. Hinweis 1

    Führen Sie es zuerst aus: == wandelt "0042" in die Zahl 42 und "" in 0 um, bevor es vergleicht.

  2. Hinweis 2

    Ersetzen Sie jedes == durch ===. Die strikte Variante prüft auch den Typ.

  3. 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.js

Prüfungen ausführen (learnrun.js muss im selben Ordner liegen):

node --test
learnrun.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
  1. 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.

  2. Hinweis 2

    Zwei Array-Klammern erzeugen zwei Arrays. const saved = basket; lässt saved auf dasselbe zeigen.

  3. 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.js

Prüfungen ausführen (learnrun.js muss im selben Ordner liegen):

node --test
learnrun.js herunterladen

Hä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 function

Warum, 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.

Problem melden

Etwas ist falsch oder unklar? Beschreiben Sie es kurz, dann wird es geprüft und korrigiert.

#

Mindestens 20 Zeichen.

Nur, wenn Sie eine Antwort wünschen.

Kernideen

=== vergleicht Typ und Wert; == wandelt zuerst um

1 === "1" ist false: Eine Zahl und ein String sind nie strikt gleich, denn === wandelt nichts um. !== ist das Gegenteil: 1 !== "1" ist true. == versucht zuerst, die beiden Typen anzugleichen, und vergleicht dann: 1 == "1" ist true, 0 == "" ist true, "" == false ist true, und null == undefined ist nach einer Sonderregel true. Diese Umwandlungen sind schwer vorherzusagen, deshalb rät MDN von == ab. Verwenden Sie === und !==, und wenn ein String als Zahl zählen soll, wandeln Sie ihn selbst um: Number("1") === 1 ist true.

NaN und -0: die zwei seltsamen Zahlen

NaN, „not a number“, ist das Ergebnis einer missglückten Rechnung, etwa von Number("12 km"). Es ist mit nichts gleich, nicht einmal mit sich selbst: NaN === NaN ist false, also ist result === NaN immer false. Prüfen Sie es mit Number.isNaN(result). Die andere seltsame Zahl ist -0, die etwa 0 * -1 ergibt. === behandelt -0 und 0 als gleich. Object.is(a, b) fragt, ob zwei Werte derselbe Wert sind: Es verhält sich wie ===, außer in diesen zwei Fällen. Object.is(NaN, NaN) ist also true und Object.is(0, -0) false.

Objekte per Referenz, Strings Zeichen für Zeichen

Arrays und Objekte werden per Referenz verglichen: [1, 2] === [1, 2] ist false, weil zwei Klammerpaare zwei getrennte Arrays mit gleichem Inhalt erzeugen. const b = a; lässt b auf dasselbe Array zeigen, also ist a === b true. Um Inhalte zu vergleichen, vergleichen Sie die Elemente: a[0] === c[0]. < und > vergleichen zwei Strings Zeichen für Zeichen nach ihrem Code: "apple" < "banana" ist true, aber ebenso "10" < "9", und Großbuchstaben kommen vor Kleinbuchstaben. Ist eine Seite eine Zahl, wird die andere umgewandelt: "10" < 9 ist false.

Quellen

Zuletzt geprüft am 30. September 2026