diff --git a/1-js/02-first-steps/12-nullish-coalescing-operator/article.md b/1-js/02-first-steps/12-nullish-coalescing-operator/article.md index 0b2f092ab..fd8bc8cbe 100644 --- a/1-js/02-first-steps/12-nullish-coalescing-operator/article.md +++ b/1-js/02-first-steps/12-nullish-coalescing-operator/article.md @@ -1,94 +1,94 @@ -# Nullish coalescing operator '??' +# Nullish Coalescing Operator '??' [recent browser="new"] -The nullish coalescing operator is written as two question marks `??`. +Der Nullish Coalescing Operator wird als zwei Fragezeichen `??` geschrieben. -As it treats `null` and `undefined` similarly, we'll use a special term here, in this article. For brevity, we'll say that a value is "defined" when it's neither `null` nor `undefined`. +Da er `null` und `undefined` ähnlich behandelt, werden wir hier in diesem Artikel einen speziellen Begriff verwenden. Kurz gesagt, wir werden sagen, dass ein Wert "definiert" ist, wenn er weder `null` noch `undefined` ist. -The result of `a ?? b` is: -- if `a` is defined, then `a`, -- if `a` isn't defined, then `b`. +Das Ergebnis von `a ?? b` ist: +- wenn `a` definiert ist, dann `a`, +- wenn `a` nicht definiert ist, dann `b`. -In other words, `??` returns the first argument if it's not `null/undefined`. Otherwise, the second one. +Anders gesagt, `??` gibt das erste Argument zurück, wenn es nicht `null/undefined` ist und andernfalls das zweite. -The nullish coalescing operator isn't anything completely new. It's just a nice syntax to get the first "defined" value of the two. +Der Nullish Coalescing Operator ist nichts völlig Neues. Es ist nur eine nette Syntax, um den ersten "definierten" Wert von zweien zu bekommen. -We can rewrite `result = a ?? b` using the operators that we already know, like this: +Wir können `result = a ?? b` mit den Operatoren umschreiben, die wir bereits kennen, so: ```js result = (a !== null && a !== undefined) ? a : b; ``` -Now it should be absolutely clear what `??` does. Let's see where it helps. +Jetzt sollte absolut klar sein, was `??` macht. Lass uns sehen, wo es hilft. -The common use case for `??` is to provide a default value. +Der gebräuchlichste Anwendungsfall für `??` ist, einen Standardwert bereitzustellen. -For example, here we show `user` if its value isn't `null/undefined`, otherwise `Anonymous`: +Beispielsweise zeigen wir hier `user` an, wenn sein Wert nicht `null/undefined` ist, ansonsten `Anonymous`: ```js run let user; -alert(user ?? "Anonymous"); // Anonymous (user is undefined) +alert(user ?? "Anonymous"); // Anonymous (user ist undefined) ``` -Here's the example with `user` assigned to a name: +Hier ist das Beispiel mit der Variablen `user`, der ein Name zugewiesen wurde: ```js run let user = "John"; -alert(user ?? "Anonymous"); // John (user is not null/undefined) +alert(user ?? "Anonymous"); // John (user ist nicht null/undefined) ``` -We can also use a sequence of `??` to select the first value from a list that isn't `null/undefined`. +Wir können auch eine Sequenz von `??` verwenden, um den ersten Wert aus einer Liste auszuwählen, der nicht `null/undefined` ist. -Let's say we have a user's data in variables `firstName`, `lastName` or `nickName`. All of them may be not defined, if the user decided not to fill in the corresponding values. +Nehmen wir an, wir haben Daten eines Benutzers in den Variablen `firstName`, `lastName` oder `nickName`. Sie müssen nicht alle definiert sein, sollte sich der Benutzer dazu entscheiden, die Information nicht auszufüllen. -We'd like to display the user name using one of these variables, or show "Anonymous" if all of them are `null/undefined`. +Wir möchten den Benutzernamen mit einer dieser Variablen anzeigen oder "Anonymous" zeigen, wenn alle `null/undefined` sind. -Let's use the `??` operator for that: +Verwenden wir hierfür den `??` Operator: ```js run let firstName = null; let lastName = null; let nickName = "Supercoder"; -// shows the first defined value: +// zeigt den ersten definierten Wert: *!* alert(firstName ?? lastName ?? nickName ?? "Anonymous"); // Supercoder */!* ``` -## Comparison with || +## Vergleich mit || -The OR `||` operator can be used in the same way as `??`, as it was described in the [previous chapter](info:logical-operators#or-finds-the-first-truthy-value). +Der ODER `||` Operator kann auf die gleiche Weise wie `??` verwendet werden, was im [vorherigen Kapitel](info:logical-operators#or-finds-the-first-truthy-value) beschrieben wurde. -For example, in the code above we could replace `??` with `||` and still get the same result: +Zum Beispiel könnten wir in dem obigen Code `??` durch `||` ersetzen und würden immer noch dasselbe Ergebnis erhalten: ```js run let firstName = null; let lastName = null; let nickName = "Supercoder"; -// shows the first truthy value: +// zeigt den ersten wahrheitswerten Wert: *!* alert(firstName || lastName || nickName || "Anonymous"); // Supercoder */!* ``` -Historically, the OR `||` operator was there first. It's been there since the beginning of JavaScript, so developers were using it for such purposes for a long time. +Historisch gesehen war der ODER `||` Operator zuerst da. Er ist seit den Anfängen von JavaScript vorhanden, sodass Entwickler ihn seit langem für solche Zwecke verwendet haben. -On the other hand, the nullish coalescing operator `??` was added to JavaScript only recently, and the reason for that was that people weren't quite happy with `||`. +Andererseits wurde der Nullish Coalescing Operator `??` erst kürzlich zu JavaScript hinzugefügt, aufgrund der Unzufriedenheit mit `||` unter Entwicklern. -The important difference between them is that: -- `||` returns the first *truthy* value. -- `??` returns the first *defined* value. +Der wichtigste Unterschied zwischen den beiden ist, dass: +- `||` den ersten *wahrheitswerten* Wert zurückgibt. +- `??` den ersten *definierten* Wert zurückgibt. -In other words, `||` doesn't distinguish between `false`, `0`, an empty string `""` and `null/undefined`. They are all the same -- falsy values. If any of these is the first argument of `||`, then we'll get the second argument as the result. +Anders gesagt, unterscheidet der `||`-Operator zwischen `false`, `0`, einer leeren Zeichenkette (`""`) und `null`/`undefined` nicht — sie werden gleichwertig betrachtet (falsy). Wenn einer dieser das erste Argument von `||` ist, dann erhalten wir als Ergebnis das zweite Argument. -In practice though, we may want to use default value only when the variable is `null/undefined`. That is, when the value is really unknown/not set. +In der Praxis jedoch möchten wir vielleicht nur dann einen Standardwert verwenden, wenn die Variable `null/undefined` ist. Das heißt, wenn der Wert wirklich unbekannt/nicht gesetzt ist. -For example, consider this: +Nehmen wir zum Beispiel: ```js run let height = 0; @@ -97,73 +97,73 @@ alert(height || 100); // 100 alert(height ?? 100); // 0 ``` -- The `height || 100` checks `height` for being a falsy value, and it's `0`, falsy indeed. - - so the result of `||` is the second argument, `100`. -- The `height ?? 100` checks `height` for being `null/undefined`, and it's not, - - so the result is `height` "as is", that is `0`. +- `height || 100` prüft `height` darauf, ob es ein falsy Wert ist, und das ist `0`, eindeutig falsy. + - daher ist das Ergebnis von `||` das zweite Argument (`100`). +- `height ?? 100` prüft `height` darauf, ob es `null/undefined` ist, und das ist es nicht, + - daher ist das Ergebnis `height` "wie es ist", also `0`. -In practice, the zero height is often a valid value, that shouldn't be replaced with the default. So `??` does just the right thing. +In der Praxis ist die Höhe von Null oft ein gültiger Wert, der nicht durch den Standardwert ersetzt werden sollte. Daher macht `??` genau das Richtige. -## Precedence +## Vorrang -The precedence of the `??` operator is the same as `||`. They both equal `3` in the [MDN table](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table). +Die Vorrangigkeit des `??` Operators ist die gleiche wie bei `||`. Beide sind gleich `3` in der [MDN-Tabelle](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table). -That means that, just like `||`, the nullish coalescing operator `??` is evaluated before `=` and `?`, but after most other operations, such as `+`, `*`. +Das bedeutet, dass genau wie `||` der Nullish Coalescing Operator `??` vor `=` und `?` ausgewertet wird, aber nach den meisten anderen Operationen, wie `+`, `*`. -So we may need to add parentheses in expressions like this: +Also könnten wir gezwungen sein, Klammern in Ausdrücken wie diesem hinzuzufügen: ```js run let height = null; let width = null; -// important: use parentheses +// wichtig: Klammern verwenden let area = (height ?? 100) * (width ?? 50); alert(area); // 5000 ``` -Otherwise, if we omit parentheses, then as `*` has the higher precedence than `??`, it would execute first, leading to incorrect results. +Wenn wir die Klammern weglassen, würde `*` als höhere Priorität als `??` zuerst ausgeführt, was zu falschen Ergebnissen führen würde. ```js -// without parentheses +// ohne Klammern let area = height ?? 100 * width ?? 50; -// ...works this way (not what we want): +// ...funktioniert so (nicht was wir wollen): let area = height ?? (100 * width) ?? 50; ``` -### Using ?? with && or || +### Verwendung von ?? mit && oder || -Due to safety reasons, JavaScript forbids using `??` together with `&&` and `||` operators, unless the precedence is explicitly specified with parentheses. +Aus Sicherheitsgründen verbietet JavaScript die Verwendung von `??` zusammen mit `&&` und `||`, es sei denn die Vorrangregeln werden durch Klammern explizit angegeben. -The code below triggers a syntax error: +Der folgende Code löst einen Syntaxfehler aus: ```js run -let x = 1 && 2 ?? 3; // Syntax error +let x = 1 && 2 ?? 3; // Syntaxfehler ``` -The limitation is surely debatable, it was added to the language specification with the purpose to avoid programming mistakes, when people start to switch from `||` to `??`. +Die Einschränkung ist sicher debattierbar, sie wurde der Sprachspezifikation hinzugefügt, um Programmierfehler zu vermeiden, wenn Leute beginnen, von `||` auf `??` umzusteigen. -Use explicit parentheses to work around it: +Verwende klare Klammern, um dies zu umgehen: ```js run *!* -let x = (1 && 2) ?? 3; // Works +let x = (1 && 2) ?? 3; // Funktioniert */!* alert(x); // 2 ``` -## Summary +## Zusammenfassung -- The nullish coalescing operator `??` provides a short way to choose the first "defined" value from a list. +- Der Nullish Coalescing Operator `??` bietet eine kurze Möglichkeit, den ersten "definierten" Wert aus einer Liste auszuwählen. - It's used to assign default values to variables: + Er wird verwendet, um Standardwerte für Variablen zuzuweisen: ```js - // set height=100, if height is null or undefined + // setze height=100, wenn height null oder undefined ist height = height ?? 100; ``` -- The operator `??` has a very low precedence, only a bit higher than `?` and `=`, so consider adding parentheses when using it in an expression. -- It's forbidden to use it with `||` or `&&` without explicit parentheses. +- Der Operator `??` hat eine sehr niedrige Vorrangigkeit, nur etwas höher als `?` und `=`, also sollte in Betracht gezogen werden, Klammern zu verwenden, wenn er in Ausdrücken verwendet wird. +- Es ist verboten, ihn mit `||` oder `&&` ohne explizite Klammern zu verwenden.