Merge branch 'master' into patch-7

Author: jchue

1-js/03-code-quality/05-testing-mocha/article.md

@@ -159,8 +159,8 @@ We can select one of two ways to organize the test here:
         assert.equal(pow(2, 3), 8);
       });
 
-      it("3 raised to power 3 is 27", function() {
-        assert.equal(pow(3, 3), 27);
+      it("3 raised to power 4 is 81", function() {
+        assert.equal(pow(3, 4), 81);
       });
 
     });
@@ -182,7 +182,7 @@ The result:
 
 [iframe height=250 src="pow-2" edit border="1"]
 
-As we could expect, the second test failed. Sure, our function always returns `8`, while the `assert` expects `27`.
+As we could expect, the second test failed. Sure, our function always returns `8`, while the `assert` expects `81`.
 
 ## Improving the implementation
 

1-js/03-code-quality/05-testing-mocha/pow-2.view/test.js

@@ -4,8 +4,8 @@ describe("pow", function() {
     assert.equal(pow(2, 3), 8);
   });
 
-  it("3 raised to power 3 is 27", function() {
-    assert.equal(pow(3, 3), 27);
+  it("3 raised to power 4 is 81", function() {
+    assert.equal(pow(3, 4), 81);
   });
 
 });

1-js/05-data-types/01-primitives-methods/article.md

@@ -7,7 +7,7 @@ Let's look at the key distinctions between primitives and objects.
 A primitive
 
 - Is a value of a primitive type.
-- There are 6 primitive types: `string`, `number`, `boolean`, `symbol`, `null` and `undefined`.
+- There are 7 primitive types: `string`, `number`, `bigint`, `boolean`, `symbol`, `null` and `undefined`.
 
 An object
 

1-js/05-data-types/02-number/article.md

@@ -413,7 +413,7 @@ There are more functions and constants in `Math` object, including trigonometry,
 To write numbers with many zeroes:
 
 - Append `"e"` with the zeroes count to the number. Like: `123e6` is the same as `123` with 6 zeroes `123000000`.
-- A negative number after `"e"` causes the number to be divided by 1 with given zeroes. E.g. `123e-6` means `0.000123` (`123` millionth).
+- A negative number after `"e"` causes the number to be divided by 1 with given zeroes. E.g. `123e-6` means `0.000123` (`123` millionths).
 
 For different numeral systems:
 

1-js/05-data-types/05-array-methods/12-reduce-object/_js.view/solution.js

@@ -0,0 +1,6 @@
+function groupById(array) {
+  return array.reduce((obj, value) => {
+    obj[value.id] = value;
+    return obj;
+  }, {})
+}

1-js/05-data-types/05-array-methods/12-reduce-object/_js.view/test.js

@@ -0,0 +1,20 @@
+describe("groupById", function() {
+
+  it("creates an object grouped by id", function() {
+    let users = [
+      {id: 'john', name: "John Smith", age: 20},
+      {id: 'ann', name: "Ann Smith", age: 24},
+      {id: 'pete', name: "Pete Peterson", age: 31},
+    ];
+
+    assert.deepEqual(groupById(users), {
+      john: {id: 'john', name: "John Smith", age: 20}
+      ann: {id: 'ann', name: "Ann Smith", age: 24},
+      pete: {id: 'pete', name: "Pete Peterson", age: 31},
+    });
+  });
+
+  it("works with an empty array", function() {
+    assert.deepEqual(groupById(users), {});
+  });
+});

1-js/05-data-types/05-array-methods/12-reduce-object/solution.md

@@ -0,0 +1,37 @@
+importance: 4
+
+---
+
+# Create keyed object from array
+
+Let's say we received an array of users in the form `{id:..., name:..., age... }`.
+
+Create a function `groupById(arr)` that creates an object from it, with `id` as the key, and array items as values.
+
+For example:
+
+```js
+let users = [
+  {id: 'john', name: "John Smith", age: 20},
+  {id: 'ann', name: "Ann Smith", age: 24},
+  {id: 'pete', name: "Pete Peterson", age: 31},
+];
+
+let usersById = groupById(users);
+
+/*
+// after the call we have:
+
+usersById = {
+  john: {id: 'john', name: "John Smith", age: 20}
+  ann: {id: 'ann', name: "Ann Smith", age: 24},
+  pete: {id: 'pete', name: "Pete Peterson", age: 31},
+}
+*/
+```
+
+Such function is really handy when working with server data.
+
+In this task we assume that `id` is unique. There may be no two array items with the same `id`.
+
+Please use array `.reduce` method in the solution.

1-js/05-data-types/05-array-methods/12-reduce-object/task.md

@@ -384,7 +384,7 @@ The order became `1, 15, 2`. Incorrect. But why?
 
 **The items are sorted as strings by default.**
 
-Literally, all elements are converted to strings for comparisons. For strings,  lexicographic ordering is applied and indeed `"2" > "15"`.
+Literally, all elements are converted to strings for comparisons. For strings, lexicographic ordering is applied and indeed `"2" > "15"`.
 
 To use our own sorting order, we need to supply a function as the argument of `arr.sort()`.
 
@@ -431,7 +431,6 @@ By the way, if we ever want to know which elements are compared -- nothing preve
 
 The algorithm may compare an element with multiple others in the process, but it tries to make as few comparisons as possible.
 
-
 ````smart header="A comparison function may return any number"
 Actually, a comparison function is only required to return a positive number to say "greater" and a negative number to say "less".
 
@@ -456,6 +455,22 @@ arr.sort( (a, b) => a - b );
 This works exactly the same as the longer version above.
 ````
 
+````smart header="Use `localeCompare` for strings"
+Remember [strings](info:string#correct-comparisons) comparison algorithm? It compares letters by their codes by default.
+
+For many alphabets, it's better to use `str.localeCompare` method to correctly sort letters, such as `Ö`.
+
+For example, let's sort a few countries in German:
+
+```js run
+let countries = ['Österreich', 'Andorra', 'Vietnam'];
+
+alert( countries.sort( (a, b) => a > b ? 1 : -1) ); // Andorra, Vietnam, Österreich (wrong)
+
+alert( countries.sort( (a, b) => a.localeCompare(b) ) ); // Andorra,Österreich,Vietnam (correct!)
+```
+````
+
 ### reverse
 
 The method [arr.reverse](mdn:js/Array/reverse) reverses the order of elements in `arr`.
@@ -530,7 +545,7 @@ The methods [arr.reduce](mdn:js/Array/reduce) and [arr.reduceRight](mdn:js/Array
 The syntax is:
 
 ```js
-let value = arr.reduce(function(previousValue, item, index, array) {
+let value = arr.reduce(function(accumulator, item, index, array) {
   // ...
 }, [initial]);
 ```
@@ -539,14 +554,16 @@ The function is applied to all array elements one after another and "carries on"
 
 Arguments:
 
-- `previousValue` -- is the result of the previous function call, equals `initial` the first time (if `initial` is provided).
+- `accumulator` -- is the result of the previous function call, equals `initial` the first time (if `initial` is provided).
 - `item` -- is the current array item.
 - `index` -- is its position.
 - `array` -- is the array.
 
 As function is applied, the result of the previous function call is passed to the next one as the first argument.
 
-Sounds complicated, but it's not if you think about the first argument as the "accumulator" that stores the combined result of all previous execution. And at the end it becomes the result of `reduce`.
+So, the first argument is essentially the accumulator that stores the combined result of all previous executions. And at the end it becomes the result of `reduce`.
+
+Sounds complicated?
 
 The easiest way to grasp that is by example.
 
@@ -611,7 +628,6 @@ let arr = [];
 arr.reduce((sum, current) => sum + current);
 ```
 
-
 So it's advised to always specify the initial value.
 
 The method [arr.reduceRight](mdn:js/Array/reduceRight) does the same, but goes from right to left.

1-js/05-data-types/05-array-methods/article.md

@@ -1,4 +1,4 @@
-# Rest parameters and spread operator
+# Rest parameters and spread syntax
 
 Many JavaScript built-in functions support an arbitrary number of arguments.
 
@@ -122,7 +122,7 @@ As we remember, arrow functions don't have their own `this`. Now we know they do
 ````
 
 
-## Spread operator [#spread-operator]
+## Spread syntax [#spread-syntax]
 
 We've just seen how to get an array from the list of parameters.
 
@@ -148,7 +148,7 @@ alert( Math.max(arr) ); // NaN
 
 And surely we can't manually list items in the code `Math.max(arr[0], arr[1], arr[2])`, because we may be unsure how many there are. As our script executes, there could be a lot, or there could be none. And that would get ugly.
 
-*Spread operator* to the rescue! It looks similar to rest parameters, also using `...`, but does quite the opposite.
+*Spread syntax* to the rescue! It looks similar to rest parameters, also using `...`, but does quite the opposite.
 
 When `...arr` is used in the function call, it "expands" an iterable object `arr` into the list of arguments.
 
@@ -169,7 +169,7 @@ let arr2 = [8, 3, -8, 1];
 alert( Math.max(...arr1, ...arr2) ); // 8
 ```
 
-We can even combine the spread operator with normal values:
+We can even combine the spread syntax with normal values:
 
 
 ```js run
@@ -179,7 +179,7 @@ let arr2 = [8, 3, -8, 1];
 alert( Math.max(1, ...arr1, 2, ...arr2, 25) ); // 25
 ```
 
-Also, the spread operator can be used to merge arrays:
+Also, the spread syntax can be used to merge arrays:
 
 ```js run
 let arr = [3, 5, 1];
@@ -192,17 +192,17 @@ let merged = [0, ...arr, 2, ...arr2];
 alert(merged); // 0,3,5,1,2,8,9,15 (0, then arr, then 2, then arr2)
 ```
 
-In the examples above we used an array to demonstrate the spread operator, but any iterable will do.
+In the examples above we used an array to demonstrate the spread syntax, but any iterable will do.
 
-For instance, here we use the spread operator to turn the string into array of characters:
+For instance, here we use the spread syntax to turn the string into array of characters:
 
 ```js run
 let str = "Hello";
 
 alert( [...str] ); // H,e,l,l,o
 ```
 
-The spread operator internally uses iterators to gather elements, the same way as `for..of` does.
+The spread syntax internally uses iterators to gather elements, the same way as `for..of` does.
 
 So, for a string, `for..of` returns characters and `...str` becomes `"H","e","l","l","o"`. The list of characters is passed to array initializer `[...str]`.
 
@@ -220,24 +220,24 @@ The result is the same as `[...str]`.
 But there's a subtle difference between `Array.from(obj)` and `[...obj]`:
 
 - `Array.from` operates on both array-likes and iterables.
-- The spread operator operates only on iterables.
+- The spread syntax works only with iterables.
 
 So, for the task of turning something into an array, `Array.from` tends to be more universal.
 
 
 ## Summary
 
-When we see `"..."` in the code, it is either rest parameters or the spread operator.
+When we see `"..."` in the code, it is either rest parameters or the spread syntax.
 
 There's an easy way to distinguish between them:
 
 - When `...` is at the end of function parameters, it's "rest parameters" and gathers the rest of the list of arguments into an array.
-- When `...` occurs in a function call or alike, it's called a "spread operator" and expands an array into a list.
+- When `...` occurs in a function call or alike, it's called a "spread syntax" and expands an array into a list.
 
 Use patterns:
 
 - Rest parameters are used to create functions that accept any number of arguments.
-- The spread operator is used to pass an array to functions that normally require a list of many arguments.
+- The spread syntax is used to pass an array to functions that normally require a list of many arguments.
 
 Together they help to travel between a list and an array of parameters with ease.