Merge pull request #74 from lenchen1112/master

Sync with upstream @74e603a

Author: lenchen1112

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

@@ -38,7 +38,7 @@
 2. 接著轉換（"編譯"）腳本為機器語言
 3. 然後機器語言極快地執行
 
-引擎會對流程中每個階段進行優化。甚至會在執行時監看編譯好的腳本，分析其資料流並以此再優化為機器碼，由此腳本可以快速地執行。
+引擎會對流程中每個階段進行優化。甚至會在執行時監看編譯好的腳本，分析其資料流，並以此再優化機器碼。
 ```
 
 ## 瀏覽器中的 JavaScript 可以做什麼？

1-js/02-first-steps/15-function-expressions-arrows/article.md renamed to 1-js/02-first-steps/15-function-expressions/article.md

@@ -1,4 +1,4 @@
-# 函式表達式和箭頭函式
+# 函式表達式
 
 在 JavaScript 中，函式不是一個 "神奇的語言結構"，而是一種特殊的值。
 
@@ -347,7 +347,6 @@ welcome(); // ok now
 */!*
 ```
 
-
 ```smart header="何時選擇函式宣告式或函式表達式？"
 根據經驗，當我們需要宣告函式時，首先考慮的是函式宣告式語法。對於組織我們的程式碼上，它給了我們更多的自由，因為我們可以在這些函式被宣告前呼叫他們。
 
@@ -356,106 +355,6 @@ welcome(); // ok now
 ...但如果函式宣告式由於某些原因不適合我們，或是我們需要條件式宣告（我們剛剛才看過例子），那就應該使用函式表達式。
 ```
 
-## 箭頭函式（Arrow functions） [#arrow-functions]
-
-創建函式還有一個非常簡潔的語法，通常比函式表達式更好。它被稱為 "箭頭函式（arrow functions）"，因為它看起來像這樣：
-
-
-```js
-let func = (arg1, arg2, ...argN) => expression
-```
-
-...這會創建一個接受引數 `arg1..argN` 的函式 `func`，運行右側的 `expression` 並回傳結果。
-
-換句話說，它大致與此相同：
-
-```js
-let func = function(arg1, arg2, ...argN) {
-  return expression;
-};
-```
-
-...但更加簡潔。
-
-讓我們來看個例子：
-
-```js run
-let sum = (a, b) => a + b;
-
-/* 箭頭函式是簡短版的：
-
-let sum = function(a, b) {
-  return a + b;
-};
-*/
-
-alert( sum(1, 2) ); // 3
-
-```
-
-如果我們只有一個引數，那麼參數旁的括號可以省略，讓它更短：
-
-```js run
-// 如同
-// let double = function(n) { return n * 2 }
-*!*
-let double = n => n * 2;
-*/!*
-
-alert( double(3) ); // 6
-```
-
-如果沒有任何引數，括號應該是空的（但他們應該被保留）：
-
-```js run
-let sayHi = () => alert("Hello!");
-
-sayHi();
-```
-
-箭頭函式的使用情境與函式宣告式相同。
-
-比如，這邊是重寫 `welcome()` 的例子：
-
-```js run
-let age = prompt("What is your age?", 18);
-
-let welcome = (age < 18) ?
-  () => alert('Hello') :
-  () => alert("Greetings!");
-
-welcome(); // ok now
-```
-
-在剛開始使用箭頭函式時，可能會覺得不熟悉且閱讀性不那麼好，但習慣這種結構後，情況會迅速改變。
-
-他們對於簡單的單行動作非常方便，尤其當我們發懶不想寫太多文字時。
-
-```smart header="多行箭頭函式"
-
-上述的範例拿 `=>` 左側的引數並在右側的表達式中使用它們。
-
-有時我們需要一些更複雜的東西，像是多個表達式或是述語。這也是可能的，但我們應該用大括弧將它們括起來。然後在其中使用普通的 `return`。
-
-像這樣：
-
-```js run
-let sum = (a, b) => {  // 大括弧開啟多行函式
-  let result = a + b;
-*!*
-  return result; // 如果我們使用大括弧，用 return 來取得結果
-*/!*
-};
-
-alert( sum(1, 2) ); // 3
-```
-
-```smart header="還有更多"
-這裡我們稍微稱讚了箭頭函式。但那不是全部！箭頭函式還有其他有趣的功能。我們稍後將在章節 <info:arrow-functions> 中回頭學習它們。
-
-目前，我們已經可以在單行動作與回呼中使用箭頭函式。
-```
-
 ## 總結
 
 - 函式是值。他們可以被指定、複製或在程式碼中任何地方被宣告。
@@ -467,8 +366,3 @@ alert( sum(1, 2) ); // 3
 在大多數情況下，當我們需要宣告一個函式時，我們偏好採用函式宣告式，因為它讓函式在宣告前就是可視的。這給了我們很多組織程式碼的彈性，通常也具有較佳的可讀性。
 
 所以我們應該只在函式宣告式不適合任務時才採用函式表達式。我們在這章節中已經看到一些例子，將來會看到更多。
-
-箭頭函式對於單行動作來說非常方便。以下是它的兩個樣貌：
-
-1. 沒有大括號：`(...args) => expression` -- 右側是一個表達式：函式執行它並回傳結果。
-2. 有大括號：`(...args) => { body }` -- 括號允許我們在函式內撰寫多行述語，但我們需要一個明確地 `return` 來回傳一些東西。

1-js/02-first-steps/15-function-expressions-arrows/1-rewrite-arrow/solution.md renamed to 1-js/02-first-steps/16-arrow-functions-basics/1-rewrite-arrow/solution.md

@@ -0,0 +1,111 @@
+# 箭頭函式，基本觀念
+
+創建函式還有一個非常簡潔的語法，通常比函式表達式更好。
+
+它被稱為 "箭頭函式（arrow functions）"，因為它看起來像這樣：
+
+```js
+let func = (arg1, arg2, ...argN) => expression
+```
+
+...這會創建一個接受引數 `arg1..argN` 的函式 `func`，運行右側的 `expression` 並回傳結果。
+
+換句話說，它是這個的簡短版本：
+
+```js
+let func = function(arg1, arg2, ...argN) {
+  return expression;
+};
+```
+
+讓我們來看個實際範例：
+
+```js run
+let sum = (a, b) => a + b;
+
+/* 箭頭函式是簡短版的：
+
+let sum = function(a, b) {
+  return a + b;
+};
+*/
+
+alert( sum(1, 2) ); // 3
+```
+
+如你所見，`(a, b) => a + b` 代表接收兩個名為 `a` 與 `b` 引數的函式。在執行時，它會運算 `a + b` 的表達式然後回傳結果。
+
+- 如果我們只有一個引數，那麼參數旁的括號可以省略，讓它更短。
+
+    例如:
+
+    ```js run
+    *!*
+    let double = n => n * 2;
+    // 大致上等同於：let double = function(n) { return n * 2 }
+    */!*
+
+    alert( double(3) ); // 6
+    ```
+
+- 如果沒有任何引數，括號應該是空的（但他們應該被保留）：
+
+    ```js run
+    let sayHi = () => alert("Hello!");
+
+    sayHi();
+    ```
+
+箭頭函式的使用情境與函式宣告式相同。
+
+例如，動態產生一個函式：
+
+```js run
+let age = prompt("What is your age?", 18);
+
+let welcome = (age < 18) ?
+  () => alert('Hello') :
+  () => alert("Greetings!");
+
+welcome(); // ok now
+```
+
+在剛開始使用箭頭函式時，可能會覺得不熟悉且閱讀性不那麼好，但習慣這種結構後，情況會迅速改變。
+
+他們對於簡單的單行動作非常方便，尤其當我們發懶不想寫太多文字時。
+
+## 多行箭頭函式
+
+上述的範例拿取 `=>` 左側的引數並在右側的表達式中使用它們。
+
+有時我們需要一些更複雜的東西，像是多個表達式或是述語。這也是可行的，但我們應該用大括弧將它們括起來。然後在其中使用普通的 `return`。
+
+像這樣：
+
+```js run
+let sum = (a, b) => {  // 大括弧開啟多行函式
+  let result = a + b;
+*!*
+  return result; // 如果我們使用大括弧，則需要明確的 "return"
+*/!*
+};
+
+alert( sum(1, 2) ); // 3
+```
+
+```smart header="還有更多"
+這裡我們稍微稱讚了箭頭函式。但那不是全部！
+
+箭頭函式還有其他有趣的功能。
+
+想更深入學習它們，我們首先需要了解 JavaScript 的其餘面向，因此我們會晚點再於章節 <info:arrow-functions> 中回來看箭頭函式。
+
+至此，我們已經可以在單行動作與回呼中使用箭頭函式。
+```
+
+## 總結
+
+箭頭函式對於單行動作來說非常方便，以下是它的兩個樣貌：
+
+1. 沒有大括號：`(...args) => expression` -- 右側是一個表達式：函式執行它並回傳結果。
+2. 有大括號：`(...args) => { body }` -- 括號允許我們在函式內撰寫多行述語，但我們需要用明確地 `return` 來回傳東西。

1-js/02-first-steps/15-function-expressions-arrows/1-rewrite-arrow/task.md renamed to 1-js/02-first-steps/16-arrow-functions-basics/1-rewrite-arrow/task.md

@@ -275,7 +275,7 @@ switch (age) {
 - 參數可以有預設值：`function sum(a = 1, b = 2) {...}`。
 - 函式永遠會回傳一些東西。如果沒有 `return` 述語，則其結果為 `undefined`。
 
-更多資訊：參見 <info:function-basics>、<info:function-expressions-arrows>。
+更多資訊：參見 <info:function-basics>、<info:arrow-functions-basics>。
 
 ## 還有更多
 

1-js/02-first-steps/16-arrow-functions-basics/article.md

@@ -447,7 +447,7 @@ alert(arr);  // *!*1, 2, 15*/!*
 ````
 
 ````smart header="Arrow functions for the best"
-Remember [arrow functions](info:function-expressions-arrows#arrow-functions)? We can use them here for neater sorting:
+Remember [arrow functions](info:arrow-functions-basics)? We can use them here for neater sorting:
 
 ```js
 arr.sort( (a, b) => a - b );

1-js/02-first-steps/16-javascript-specials/article.md renamed to 1-js/02-first-steps/17-javascript-specials/article.md

@@ -33,6 +33,13 @@ To create a new `Date` object call `new Date()` with one of the following argume
 
     It's a lightweight numeric representation of a date. We can always create a date from a timestamp using `new Date(timestamp)` and convert the existing `Date` object to a timestamp using the `date.getTime()` method (see below).
 
+    Dates before 01.01.1970 have negative timestamps, e.g.:
+    ```js run
+    // 31 Dec 1969
+    let Dec31_1969 = new Date(-24 * 3600 * 1000);
+    alert( Dec31_1969 );
+    ```
+
 `new Date(datestring)`
 : If there is a single argument, and it's a string, then it is parsed automatically. The algorithm is the same as `Date.parse` uses, we'll cover it later.
 

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

@@ -116,9 +116,9 @@ alert(User.prototype.sayHi); // alert(this.name);
 alert(Object.getOwnPropertyNames(User.prototype)); // constructor, sayHi
 ```
 
-## Not just a syntax sugar
+## Not just a syntactic sugar
 
-Sometimes people say that `class` is a "syntax sugar" (syntax that is designed to make things easier to read, but doesn't introduce anything new), because we could actually declare the same without `class` keyword at all:
+Sometimes people say that `class` is a "syntactic sugar" (syntax that is designed to make things easier to read, but doesn't introduce anything new), because we could actually declare the same without `class` keyword at all:
 
 ```js run
 // rewriting class User in pure functions
@@ -140,7 +140,7 @@ let user = new User("John");
 user.sayHi();
 ```
 
-The result of this definition is about the same. So, there are indeed reasons why `class` can be considered a syntax sugar to define a constructor together with its prototype methods.
+The result of this definition is about the same. So, there are indeed reasons why `class` can be considered a syntactic sugar to define a constructor together with its prototype methods.
 
 Still, there are important differences.
 
@@ -282,7 +282,7 @@ Object.defineProperties(User.prototype, {
 });
 ```
 
-Here's an example with a computed property in brackets `[...]`:
+Here's an example with a computed property name in brackets `[...]`:
 
 ```js run
 class User {
@@ -318,6 +318,9 @@ class User {
 }
 
 new User().sayHi();
+
+alert(User.prototype.sayHi); // placed in User.prototype
+alert(User.prototype.name); // undefined, not placed in User.prototype
 ```
 
 The property `name` is not placed into `User.prototype`. Instead, it is created by `new` before calling the constructor, it's a property of the object itself.

1-js/05-data-types/11-date/article.md

@@ -40,7 +40,7 @@ The syntax to extend another class is: `class Child extends Parent`.
 
 Let's create `class Rabbit` that inherits from `Animal`:
 
-```js run
+```js
 *!*
 class Rabbit extends Animal {
 */!*

1-js/09-classes/01-class/article.md

@@ -19,12 +19,14 @@ User.staticMethod(); // true
 
 That actually does the same as assigning it as a property directly:
 
-```js
+```js run
 class User() { }
 
 User.staticMethod = function() {
   alert(this === User);
 };
+
+User.staticMethod(); // true
 ```
 
 The value of `this` in `User.staticMethod()` call is the class constructor `User` itself (the "object before dot" rule).
@@ -123,14 +125,15 @@ That is the same as a direct assignment to `Article`:
 Article.publisher = "Ilya Kantor";
 ```
 
-## Inheritance of static methods
+## Inheritance of static properties and methods
 
-Static methods are inherited.
+Static properties and methods are inherited.
 
-For instance, `Animal.compare` in the code below is inherited and accessible as `Rabbit.compare`:
+For instance, `Animal.compare` and `Animal.planet` in the code below are inherited and accessible as `Rabbit.compare` and `Rabbit.planet`:
 
 ```js run
 class Animal {
+  static planet = "Earth";
 
   constructor(name, speed) {
     this.speed = speed;
@@ -167,6 +170,8 @@ rabbits.sort(Rabbit.compare);
 */!*
 
 rabbits[0].run(); // Black Rabbit runs with speed 5.
+
+alert(Rabbit.planet); // Earth
 ```
 
 Now when we call `Rabbit.compare`, the inherited `Animal.compare` will be called.

1-js/09-classes/02-class-inheritance/article.md

@@ -3,11 +3,11 @@
 
 There are many areas where we need random data.
 
-One of them is testing. We may need random data: text, numbers etc, to test things out well.
+One of them is testing. We may need random data: text, numbers, etc. to test things out well.
 
 In JavaScript, we could use `Math.random()`. But if something goes wrong, we'd like to be able to repeat the test, using exactly the same data.
 
-For that, so called "seeded pseudo-random generators" are used. They take a "seed", the first value, and then generate next ones using a formula. So that the same seed yields the same sequence, and hence the whole flow is easily reproducible. We only need to remember the seed to repeat it.
+For that, so called "seeded pseudo-random generators" are used. They take a "seed", the first value, and then generate the next ones using a formula so that the same seed yields the same sequence, and hence the whole flow is easily reproducible. We only need to remember the seed to repeat it.
 
 An example of such formula, that generates somewhat uniformly distributed values: