DanLevy.net

Quiz: Kennst du modernes JavaScript?

Beweise deine JavaScript‑Skills!

Kennst du den Unterschied zwischen ES2015 und ES2022?

1. 

ES2020

Wie lautet der Wert von result?

console.log(null ?? 100);

Der Null‑Koaleszenz‑Operator (??) gibt den rechten Operanden (b) zurück, wenn der linke Operanden (a) null oder undefined ist. In diesem Fall ist a null, also ist result 100.

2. 

ES2020

Was wird die Ausgabe des folgenden Codes sein?

const value = false;
const defaultVal = 42;
console.log(value ?? defaultVal);

Der Null‑Koaleszenz‑Operator (??) behandelt falsy‑Werte wie false als gültige Werte. Da value false ist, wird er als gültiger Wert angesehen und zurückgegeben.

3. 

Optionale Verkettung

Was gibt der folgende Code aus?

const obj = { foo: null };
const result = obj.foo?.bar;
console.log(result);

Der optionale Verkettungsoperator (?.) stoppt die Auswertung, wenn die linke Seite null oder undefined ist. Da obj.foo null ist, evaluiert obj.foo?.bar zu undefined.

4. 

BigInt

Was ist die Ausgabe des folgenden Codes?

const a = 42n;
const result = a * 2n;
console.log(result);

BigInt‑Werte werden erzeugt, indem man an eine Zahl n anhängt. Man kann BigInt nicht mit normalen Zahlen in arithmetischen Operationen mischen. Hier sind beide Werte BigInt, sodass die Multiplikation funktioniert und 84n ergibt.

5. 

Dynamischer Import

Was wird hier ausgegeben?

const modulePromise = import('./myModule.js');
console.log(typeof modulePromise);

Die import()‑Funktion gibt ein Promise zurück, das zum Modul‑Objekt aufgelöst wird. Da Promise‑Instanzen Objekte sind, gibt typeof modulePromise 'object' aus.

6. 

Promise.allSettled

Was wird das Ergebnis des folgenden Codes sein?

const promises = [
  Promise.resolve('success'),
  Promise.reject('error')
];
Promise.allSettled(promises).then(results => {
  console.log(results[0].status + ': ' + results[0].value);
});

Promise.allSettled gibt ein Array von Objekten zurück, die das Ergebnis jeder Promise beschreiben. Die erste Promise ist fulfilled mit dem Wert 'success', daher wird die Log‑Anweisung fulfilled: success ausgeben.

7. 

String.matchAll

Was gibt str.matchAll() zurück?

const str = 'foo1bar2baz3';
const matches = str.matchAll(/\d/g);

String.matchAll gibt einen Iterator von Treffern zurück, nicht ein Array. Dieser Iterator kann verwendet werden, um alle passenden Gruppen aus einem String zu erhalten.

8. 

Import-Meta

Was stellt import.meta.url dar?

console.log(import.meta.url);

import.meta ist ein Objekt, das Metadaten über das aktuelle Modul enthält. Die Eigenschaft import.meta.url stellt die URL des aktuellen Moduls dar und kann verwendet werden, um Informationen darüber zu erhalten, wo das Skript ausgeführt wird.

9. 

Logische Zuweisung

Wie lautet der Wert von a nach der logischen Zuweisung?

let a = null;
a ||= 10;
console.log(a);

Die logische ODER‑Zuweisung (||=) weist den rechten Wert zu, wenn der linke Wert falsy ist (null, undefined, 0, false usw.). Da a null ist, wird ihr der Wert 10 zugewiesen.

10. 

Logische Nullish-Zuweisung

Wie lautet der Wert von b nach der Nullish‑Zuweisung?

let b = null;
b ??= 10;
console.log(b);

Die Nullish‑Coalescing‑Zuweisung (??=) weist den rechten Wert zu, wenn der linke Wert null oder undefined ist. Da b null ist, wird ihr der Wert 10 zugewiesen.

11. 

WeakRef

Was bietet WeakRef?

const obj = { data: 'important' };
const ref = new WeakRef(obj);
console.log(ref.deref());

WeakRef liefert eine schwache Referenz auf ein Objekt, wodurch das Objekt vom Garbage Collector freigegeben werden kann, wenn keine anderen Referenzen mehr existieren. Da obj hier noch stark referenziert wird, gibt deref() das ursprüngliche Objekt zurück. Wäre das Ziel bereits freigegeben, würde deref() undefined zurückgeben.

Loading comments...