Merge branch 'master' of github.com:javascript-tutorial/en.javascript.info into sync-f4891457

Author: iliakan

1-js/01-getting-started/1-intro/article.md

@@ -26,7 +26,7 @@ Different engines have different "codenames". For example:
 
 - [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- in Chrome and Opera.
 - [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- in Firefox.
-- ...There are other codenames like "Trident" and "Chakra" for different versions of IE, "ChakraCore" for Microsoft Edge, "Nitro" and "SquirrelFish" for Safari, etc.
+- ...There are other codenames like "Chakra" for IE, "ChakraCore" for Microsoft Edge, "Nitro" and "SquirrelFish" for Safari, etc.
 
 The terms above are good to remember because they are used in developer articles on the internet. We'll use them too. For instance, if "a feature X is supported by V8", then it probably works in Chrome and Opera.
 

1-js/02-first-steps/05-types/article.md

@@ -81,10 +81,13 @@ const bigInt = 1234567890123456789012345678901234567890n;
 
 As `BigInt` numbers are rarely needed, we don't cover them here, but devoted them a separate chapter <info:bigint>. Read it when you need such big numbers.
 
+
 ```smart header="Compatibility issues"
-Right now `BigInt` is supported in Firefox/Chrome/Edge, but not in Safari/IE.
+Right now, `BigInt` is supported in Firefox/Chrome/Edge/Safari, but not in IE.
 ```
 
+You can check [*MDN* BigInt compatibility table](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt#Browser_compatibility) to know which versions of a browser are supported.
+
 ## String
 
 A string in JavaScript must be surrounded by quotes.

1-js/02-first-steps/08-operators/4-fix-prompt/solution.md

@@ -9,8 +9,7 @@ let b = "2"; // prompt("Second number?", 2);
 alert(a + b); // 12
 ```
 
-What we should do is to convert strings to numbers before `+`. For example, using `Number()` or
-prepending them with `+`.
+What we should do is to convert strings to numbers before `+`. For example, using `Number()` or prepending them with `+`.
 
 For example, right before `prompt`:
 

1-js/02-first-steps/08-operators/article.md

@@ -180,7 +180,7 @@ Parentheses override any precedence, so if we're not satisfied with the default
 
 There are many operators in JavaScript. Every operator has a corresponding precedence number. The one with the larger number executes first. If the precedence is the same, the execution order is from left to right.
 
-Here's an extract from the [precedence table](https://developer.mozilla.org/en/JavaScript/Reference/operators/operator_precedence) (you don't need to remember this, but note that unary operators are higher than corresponding binary ones):
+Here's an extract from the [precedence table](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence) (you don't need to remember this, but note that unary operators are higher than corresponding binary ones):
 
 | Precedence | Name | Sign |
 |------------|------|------|

1-js/02-first-steps/09-comparison/1-comparison-questions/solution.md

@@ -14,7 +14,7 @@ Some of the reasons:
 
 1. Obviously, true.
 2. Dictionary comparison, hence false. `"a"` is smaller than `"p"`.
-3. Again, dictionary comparison, first char of `"2"` is greater than the first char of `"1"`.
+3. Again, dictionary comparison, first char `"2"` is greater than the first char `"1"`.
 4. Values `null` and `undefined` equal each other only.
 5. Strict equality is strict. Different types from both sides lead to false.
 6. Similar to `(4)`, `null` only equals `undefined`.

1-js/02-first-steps/09-comparison/article.md

@@ -9,9 +9,9 @@ In JavaScript they are written like this:
 - Equals: `a == b`, please note the double equality sign `==` means the equality test, while a single one `a = b` means an assignment.
 - Not equals. In maths the notation is <code>&ne;</code>, but in JavaScript it's written as <code>a != b</code>.
 
-In this article we'll learn more about different types of comparisons, how JavaScript makes them, including important peculiarities. 
+In this article we'll learn more about different types of comparisons, how JavaScript makes them, including important peculiarities.
 
-At the end you'll find a good recipe to avoid "javascript quirks"-related issues.
+At the end you'll find a good recipe to avoid "JavaScript quirks"-related issues.
 
 ## Boolean is the result
 
@@ -57,7 +57,7 @@ The algorithm to compare two strings is simple:
 4. Repeat until the end of either string.
 5. If both strings end at the same length, then they are equal. Otherwise, the longer string is greater.
 
-In the examples above, the comparison `'Z' > 'A'` gets to a result at the first step while the strings `"Glow"` and `"Glee"` are compared character-by-character:
+In the examples above, the comparison `'Z' > 'A'` gets to a result at the first step while the strings `'Glow'` and `'Glee'` are compared character-by-character:
 
 1. `G` is the same as `G`.
 2. `l` is the same as `l`.

1-js/02-first-steps/11-logical-operators/6-check-if-in-range/task.md

@@ -4,6 +4,6 @@ importance: 3
 
 # Check the range between
 
-Write an "if" condition to check that `age` is between `14` and `90` inclusively.
+Write an `if` condition to check that `age` is between `14` and `90` inclusively.
 
 "Inclusively" means that `age` can reach the edges `14` or `90`.

1-js/02-first-steps/11-logical-operators/7-check-if-out-range/task.md

@@ -4,6 +4,6 @@ importance: 3
 
 # Check the range outside
 
-Write an `if` condition to check that `age` is NOT between 14 and 90 inclusively.
+Write an `if` condition to check that `age` is NOT between `14` and `90` inclusively.
 
 Create two variants: the first one using NOT `!`, the second one -- without it.

1-js/02-first-steps/11-logical-operators/9-check-login/solution.md

@@ -3,19 +3,19 @@
 ```js run demo
 let userName = prompt("Who's there?", '');
 
-if (userName == 'Admin') {
+if (userName === 'Admin') {
 
   let pass = prompt('Password?', '');
 
-  if (pass == 'TheMaster') {
+  if (pass === 'TheMaster') {
     alert( 'Welcome!' );
-  } else if (pass == '' || pass == null) {
+  } else if (pass === '' || pass === null) {
     alert( 'Canceled' );
   } else {
     alert( 'Wrong password' );
   }
 
-} else if (userName == '' || userName == null) {
+} else if (userName === '' || userName === null) {
   alert( 'Canceled' );
 } else {
   alert( "I don't know you" );

1-js/02-first-steps/11-logical-operators/article.md

@@ -84,7 +84,7 @@ The OR `||` operator does the following:
 
 A value is returned in its original form, without the conversion.
 
-In other words, a chain of OR `"||"` returns the first truthy value or the last one if no truthy value is found.
+In other words, a chain of OR `||` returns the first truthy value or the last one if no truthy value is found.
 
 For instance:
 
@@ -101,9 +101,9 @@ This leads to some interesting usage compared to a "pure, classical, boolean-onl
 
 1. **Getting the first truthy value from a list of variables or expressions.**
 
-    For instance, we have `firstName`, `lastName` and `nickName` variables, all optional.
+    For instance, we have `firstName`, `lastName` and `nickName` variables, all optional (i.e. can be undefined or have falsy values).
 
-    Let's use OR `||` to choose the one that has the data and show it (or `anonymous` if nothing set):
+    Let's use OR `||` to choose the one that has the data and show it (or `"Anonymous"` if nothing set):
 
     ```js run
     let firstName = "";
@@ -115,7 +115,7 @@ This leads to some interesting usage compared to a "pure, classical, boolean-onl
     */!*
     ```
 
-    If all variables were falsy, `Anonymous` would show up.
+    If all variables were falsy, `"Anonymous"` would show up.
 
 2. **Short-circuit evaluation.**
 
@@ -223,7 +223,7 @@ The precedence of AND `&&` operator is higher than OR `||`.
 So the code `a && b || c && d` is essentially the same as if the `&&` expressions were in parentheses: `(a && b) || (c && d)`.
 ````
 
-````warn header="Don't replace `if` with || or &&"
+````warn header="Don't replace `if` with `||` or `&&`"
 Sometimes, people use the AND `&&` operator as a "shorter way to write `if`".
 
 For instance:
@@ -244,7 +244,7 @@ let x = 1;
 if (x > 0) alert( 'Greater than zero!' );
 ```
 
-Although, the variant with `&&` appears shorter, `if` is more obvious and tends to be a little bit more readable. So we recommend using every construct for its purpose: use `if` if we want if and use `&&` if we want AND.
+Although, the variant with `&&` appears shorter, `if` is more obvious and tends to be a little bit more readable. So we recommend using every construct for its purpose: use `if` if we want `if` and use `&&` if we want AND.
 ````
 
 

1-js/02-first-steps/12-nullish-coalescing-operator/article.md

@@ -2,56 +2,92 @@
 
 [recent browser="new"]
 
-The nullish coalescing operator `??` provides a short syntax for selecting a first "defined" variable from the list.
+Here, in this article, we'll say that an expression is "defined" when it's neither `null` nor `undefined`.
+
+The nullish coalescing operator is written as two question marks `??`.
 
 The result of `a ?? b` is:
-- `a` if it's not `null` or `undefined`,
-- `b`, otherwise.
+- if `a` is defined, then `a`,
+- if `a` isn't defined, then `b`.
+
+
+In other words, `??` returns the first argument if it's defined. Otherwise, the second one.
 
-So, `x = a ?? b` is a short equivalent to:
+The nullish coalescing operator isn't anything completely new. It's just a nice syntax to get the first "defined" value of the two.
+
+We can rewrite `result = a ?? b` using the operators that we already know, like this:
 
 ```js
-x = (a !== null && a !== undefined) ? a : b;
+result = (a !== null && a !== undefined) ? a : b;
+```
+
+The common use case for `??` is to provide a default value for a potentially undefined variable.
+
+For example, here we show `Anonymous` if `user` isn't defined:
+
+```js run
+let user;
+
+alert(user ?? "Anonymous"); // Anonymous
 ```
 
-Here's a longer example.
+Of course, if `user` had any value except `null/undefined`, then we would see it instead:
+
+```js run
+let user = "John";
+
+alert(user ?? "Anonymous"); // John
+```
 
-Imagine, we have a user, and there are variables `firstName`, `lastName` or `nickName` for their first name, last name and the nick name. All of them may be undefined, if the user decided not to enter any value.
+We can also use a sequence of `??` to select the first defined value from a list.
 
-We'd like to display the user name: one of these three variables, or show "Anonymous" if nothing is set.
+Let's say we have a user's data in variables `firstName`, `lastName` or `nickName`. All of them may be undefined, if the user decided not to enter a value.
 
-Let's use the `??` operator to select the first defined one:
+We'd like to display the user name using one of these variables, or show "Anonymous" if all of them are undefined.
+
+Let's use the `??` operator for that:
 
 ```js run
 let firstName = null;
 let lastName = null;
 let nickName = "Supercoder";
 
-// show the first not-null/undefined value
+// shows the first defined value:
 *!*
 alert(firstName ?? lastName ?? nickName ?? "Anonymous"); // Supercoder
 */!*
 ```
 
 ## Comparison with ||
 
-The OR `||` operator can be used in the same way as `??`. Actually, we can replace `??` with `||` in the code above and get the same result, as it was described in the [previous chapter](info:logical-operators#or-finds-the-first-truthy-value).
-
-The important difference is that:
-- `||` returns the first *truthy* value.
-- `??` returns the first *defined* value.
+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).
 
-This matters a lot when we'd like to treat `null/undefined` differently from `0`.
+For example, in the code above we could replace `??` with `||` and still get the same result:
 
-For example, consider this:
+```js run
+let firstName = null;
+let lastName = null;
+let nickName = "Supercoder";
 
-```js
-height = height ?? 100;
+// shows the first truthy value:
+*!*
+alert(firstName || lastName || nickName || "Anonymous"); // Supercoder
+*/!*
 ```
 
-This sets `height` to `100` if it's not defined.
+The OR `||` operator exists since the beginning of JavaScript, so developers were using it for such purposes for a long time.
+
+On the other hand, the nullish coalescing operator `??` was added only recently, and the reason for that was that people weren't quite happy with `||`.
 
-Let's compare it with `||`:
+The subtle, yet important difference is that:
+- `||` returns the first *truthy* value.
+- `??` returns the first *defined* value.
+
+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.
+
+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.
+
+For example, consider this:
 
 ```js run
 let height = 0;
@@ -60,19 +96,20 @@ alert(height || 100); // 100
 alert(height ?? 100); // 0
 ```
 
-Here, `height || 100` treats zero height as unset, same as `null`, `undefined` or any other falsy value. So the result is `100`.
+Here, we have a zero height.
 
-The `height ?? 100` returns `100` only if `height` is exactly `null` or `undefined`. So the `alert` shows the height value `0` "as is".
+- The `height || 100` checks `height` for being a falsy value, and it really is.
+    - so the result 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`.
 
-Which behavior is better depends on a particular use case. When zero height is a valid value, then `??` is preferrable.
+If we assume that zero height is a valid value, that shouldn't be replaced with the default, then `??` does just the right thing.
 
 ## Precedence
 
-The precedence of the `??` operator is rather low: `5` in the [MDN table](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table).
-
-So `??` is evaluated after most other operations, but before `=` and `?`.
+The precedence of the `??` operator is rather low: `5` in the [MDN table](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table). So `??` is evaluated before `=` and `?`, but after most other operations, such as `+`, `*`.
 
-If we need to choose a value with `??` in a complex expression, then consider adding parentheses:
+So if we'd like to choose a value with `??` in an expression with other operators, consider adding parentheses:
 
 ```js run
 let height = null;
@@ -84,26 +121,27 @@ let area = (height ?? 100) * (width ?? 50);
 alert(area); // 5000
 ```
 
-Otherwise, if we omit parentheses, `*` has the higher precedence than `??` and would run first.
-
-That would work be the same as:
+Otherwise, if we omit parentheses, then as `*` has the higher precedence than `??`, it would execute first, leading to incorrect results.
 
 ```js
-// probably not correct
+// without parentheses
+let area = height ?? 100 * width ?? 50;
+
+// ...works the same as this (probably not what we want):
 let area = height ?? (100 * width) ?? 50;
 ```
 
-There's also a related language-level limitation.
+### Using ?? with && or ||
 
-**Due to safety reasons, it's forbidden to use `??` together with `&&` and `||` operators.**
+Due to safety reasons, JavaScript forbids using `??` together with `&&` and `||` operators, unless the precedence is explicitly specified with parentheses.
 
 The code below triggers a syntax error:
 
 ```js run
 let x = 1 && 2 ?? 3; // Syntax error
 ```
 
-The limitation is surely debatable, but it was added to the language specification with the purpose to avoid programming mistakes, as people start to switch to `??` from `||`.
+The limitation is surely debatable, but it was added to the language specification with the purpose to avoid programming mistakes, when people start to switch to `??` from `||`.
 
 Use explicit parentheses to work around it:
 
@@ -126,5 +164,5 @@ alert(x); // 2
     height = height ?? 100;
     ```
 
-- The operator `??` has a very low precedence, a bit higher than `?` and `=`.
+- The operator `??` has a very low precedence, 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.

1-js/02-first-steps/15-function-basics/article.md

@@ -185,7 +185,7 @@ For instance, the aforementioned function `showMessage(from, text)` can be calle
 showMessage("Ann");
 ```
 
-That's not an error. Such a call would output `"Ann: undefined"`. There's no `text`, so it's assumed that `text === undefined`.
+That's not an error. Such a call would output `"*Ann*: undefined"`. There's no `text`, so it's assumed that `text === undefined`.
 
 If we want to use a "default" `text` in this case, then we can specify it after `=`: