Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
25 commits
Select commit Hold shift + click to select a range
0742571
refactor(textlint): textlint-rule-ja-no-redundant-expressionの検知を元に修正
azu Dec 26, 2018
1dac8dd
refactor: "すること[助詞]できる"を修正
azu Jan 4, 2019
51972fc
refactor: 行う、実行する系の冗長な表現を修正
azu Jan 4, 2019
b68aa43
fix(variable): fix lint
azu Jan 4, 2019
c264020
Update source/use-case/ajaxapp/display/README.md
azu Jan 8, 2019
95f101b
Update source/use-case/ajaxapp/promise/README.md
azu Jan 8, 2019
d205a74
Update source/basic/async/README.md
azu Jan 8, 2019
23e3e49
Update source/basic/async/README.md
azu Jan 8, 2019
896d680
Update source/basic/async/README.md
azu Jan 8, 2019
332addc
Update source/basic/class/README.md
azu Jan 8, 2019
ca6aa49
Update source/basic/class/README.md
azu Jan 8, 2019
f415839
Update source/basic/class/README.md
azu Jan 8, 2019
8963a5f
Update source/basic/function-declaration/README.md
azu Jan 8, 2019
875f29b
Update source/basic/read-eval-print/README.md
azu Jan 8, 2019
3194e8d
Update source/basic/string/README.md
azu Jan 8, 2019
a6aeac0
Update source/basic/string/README.md
azu Jan 8, 2019
713ab09
Update source/intro/feedback/README.md
azu Jan 8, 2019
d737d19
Update source/basic/condition/README.md
azu Jan 8, 2019
2e85deb
Update source/basic/function-declaration/README.md
azu Jan 8, 2019
fdbcc06
Update source/basic/implicit-coercion/README.md
azu Jan 8, 2019
924c81c
Update source/basic/implicit-coercion/README.md
azu Jan 8, 2019
d7d5b98
chore(textlint): デフォルトの設定に戻す
azu Jan 8, 2019
18f8bbb
refactor: 細かい修正
azu Jan 8, 2019
61abcbd
Update source/basic/function-scope/README.md
azu Jan 12, 2019
66cddd1
Update source/use-case/todoapp/event-model/README.md
azu Jan 12, 2019
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file removed book.pdf
Binary file not shown.
6 changes: 3 additions & 3 deletions source/basic/array/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -447,7 +447,7 @@ console.log(newArray); // => ["A", "B", "C", "新しい要素"]
### `Array#splice` {#splice}

配列の先頭や末尾の要素を削除する場合は`Array#shift`や`Array#pop`で行えます。
しかし、配列の任意のインデックスにある要素を削除することはできません
しかし、配列の任意のインデックスにある要素を削除できません
配列の任意のインデックスの要素削除するには`Array#splice`を利用できます。

`Array#splice`メソッドを利用すると、削除した要素を自動で詰めることができます。
Expand Down Expand Up @@ -786,7 +786,7 @@ myFunc("a", "b", "c");
## メソッドチェーンと高階関数 {#method-chain-and-high-order-function}

配列で頻出するパターンとしてメソッドチェーンがあります。
メソッドチェーンとは名前のとおり、メソッドの呼び出しを行いその結果の値に対してさらにメソッドを呼び出すパターンのことを言います
メソッドチェーンとは名前のとおり、メソッドを呼び出した返り値に対してメソッド呼び出しをするパターンのことを言います

次のコードでは、`Array#concat`メソッドの返り値、つまり配列に対してさらに`concat`メソッドを呼び出すというメソッドチェーンが行われています。

Expand Down Expand Up @@ -844,4 +844,4 @@ console.log(versionNames); // => ["ECMAScript 1", "ECMAScript 2", "ECMAScript 3"
[ループと反復処理]: ../loop/README.md
[immutable-array-prototype]: https://github.com/azu/immutable-array-prototype "azu/immutable-array-prototype: A collection of Immutable Array prototype methods(Per method packages)."
[Lodash]: https://lodash.com/ "Lodash"
[Immutable.js]: https://facebook.github.io/immutable-js/ "Immutable.js"
[Immutable.js]: https://facebook.github.io/immutable-js/ "Immutable.js"
24 changes: 14 additions & 10 deletions source/basic/async/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ author: azu
同期処理では実行している処理はひとつだけとなるため、とても直感的な動作となります。

一方、同期的にブロックする処理が行われていた場合には問題があります。
同期処理ではひとつの処理が終わるまで次の処理を行うことができないためです
同期処理ではひとつの処理が終わるまで、次の処理へ進むことができないためです

次のコードの`blockTime`関数は指定した`timeout`ミリ秒だけ無限ループを行い同期的にブロックする処理です。
この`blockTime`関数を呼び出すと、指定時間経過するまで次の処理(次の行)が呼ばれません。
Expand All @@ -47,7 +47,7 @@ console.log("この行が呼ばれるまで処理が1秒間ブロックされる

このような同期的にブロックするのは、ブラウザでは大きな問題となります。
なぜなら、JavaScriptは基本的にブラウザのメインスレッド(UIスレッドとも呼ばれる)で実行されるためです。
そのため、JavaScriptで同期的にブロックする処理を行うと他の処理ができなくなるため、画面がフリーズしたような体感を与えてしまいます。
そのため、JavaScriptで同期的にブロックする処理を行うと、他の処理ができなくなるため、画面がフリーズしたような体感を与えてしまいます。

さきほどの例では1秒間も処理をブロックしているため、1秒間スクロールやクリックなどの他の操作が効かないといった悪影響がでます。

Expand All @@ -59,7 +59,7 @@ console.log("この行が呼ばれるまで処理が1秒間ブロックされる
また非同期処理はコードを順番に処理していきますが、ひとつの非同期処理が終わるのを待たずに次の処理を評価します。
つまり、非同期処理では同時に実行している処理は複数あります。

JavaScriptにおいて代表的な非同期処理を行う関数として`setTimeout`関数があります。
JavaScriptにおいて非同期処理をする代表的な関数として`setTimeout`関数があります。
`setTimeout`関数は`delay`ミリ秒後に、`コールバック関数`を呼び出すようにタイマーへ登録する非同期処理です。

<!-- doctest:disable -->
Expand Down Expand Up @@ -97,11 +97,15 @@ console.log("2. 同期的な処理を実行します");

このコードを実行した結果のコンソールログは次のようになります。

<!-- textlint-disable preset-ja-technical-writing/ja-no-redundant-expression -->

1. setTimeoutのコールバック関数を10ミリ秒後に実行します
2. 同期的な処理を実行します
3. ブロックする処理を開始します
4. ブロックする処理が完了しました

<!-- textlint-enable preset-ja-technical-writing/ja-no-redundant-expression -->

このように、非同期処理(`setTimeout`のコールバック関数)は、コードの見た目上の並びとは異なる順番で実行されることがわかります。

## 非同期処理はメインスレッドで実行される {#async-and-main-thread}
Expand All @@ -114,7 +118,7 @@ JavaScriptにおいて多くの非同期処理はメインスレッドで実行
このセクションでは非同期処理がどのようにメインスレッドで実行されているかを簡潔に見ていきます。

次のコードは、`setTimeout`関数でタイマーに登録したコールバック関数が呼ばれるまで、実際にどの程度の時間がかかったかを計測しています。
また、`setTimeout`関数でタイマーに登録した次の行で同期的にブロックする処理を実行しています
また、`setTimeout`関数でタイマーに登録した次の行で、同期的にブロックする処理を実行しています

非同期処理(コールバック関数)がメインスレッド以外のスレッドで実行されるならば、
この非同期処理はメインスレッドでの同期的にブロックする処理の影響を受けないはずです。
Expand Down Expand Up @@ -185,7 +189,7 @@ console.log("この文は実行されます");

非同期処理では、`try...catch`構文を使っても非同期的に発生した例外をキャッチできません。
次のコードでは、10ミリ秒後に非同期的なエラーを発生させています。
しかし、`try...catch`構文では次のような非同期エラーをキャッチすることはできません
しかし、`try...catch`構文では次のような非同期エラーをキャッチできません

{{book.console}}
<!-- doctest:disable -->
Expand Down Expand Up @@ -258,12 +262,12 @@ fs.readFile("./example.txt", (error, data) => {
});
```

このエラーファーストコールバックはNode.jsでは広く使われ、Node.jsの標準APIにおいても非同期処理を行う関数では利用されています
このエラーファーストコールバックはNode.jsでは広く使われ、Node.jsの標準APIの非同期処理をする関数において利用されています
詳しい扱い方については[ユースケース: Node.jsでCLIアプリケーション][]にて紹介します。

実際にエラーファーストコールバックで非同期な例外処理を扱うコードを書いてみましょう。

次のコードの`dummyFetch`関数は、擬似的なリソースの取得を行う非同期な処理です
次のコードの`dummyFetch`関数は、擬似的なリソースの取得をする非同期な処理です
第1引数に任意のパスを受け取り、第2引数にエラーファーストコールバックスタイルの関数を受けとります。

この`dummyFetch`関数は、任意のパスにマッチするリソースがある場合には、第2引数のコールバック関数に`null`とレスポンスオブジェクトを渡して呼び出します。
Expand Down Expand Up @@ -1213,7 +1217,7 @@ Promise.race([
このようにPromiseを使うことで非同期処理のさまざまなパターンが形成できます。
より詳しいPromiseの使い方については[JavaScript Promiseの本][]というオンラインで公開されている文書にまとめられています。

一方でPromiseはただのビルトインオブジェクトであるため、非同期処理間の連携を行うにはPromiseチェーンのように少し特殊な書き方や見た目になります
一方でPromiseはただのビルトインオブジェクトであるため、非同期処理間の連携をするにはPromiseチェーンのように少し特殊な書き方や見た目になります
また、エラーハンドリングについても`Promise#catch`メソッドや`Promise#finally`メソッドなど`try...catch`構文とよく似た名前を使います。
しかし、Promiseは構文ではなくただのオブジェクトであるため、それらをメソッドチェーンとして実現しないといけないといった制限があります。

Expand Down Expand Up @@ -1354,7 +1358,7 @@ async function asyncMain() {
}
```

普通の処理の流れでは非同期処理を実行した場合にその非同期処理の完了を待つことなく、次の行(次の文)を実行します。
普通の処理の流れでは、非同期処理を実行した場合にその非同期処理の完了を待つことなく、次の行(次の文)を実行します。
しかし`await`式では非同期処理を実行し完了するまで、次の行(次の文)を実行しません。
そのため`await`式を使うことで非同期処理が同期処理のように上から下へと順番に実行するような処理順で書けます。

Expand Down Expand Up @@ -1601,7 +1605,7 @@ fetchResources().then((results) => {
});
```

Promiseチェーンで`fetchResources`関数書いた場合はコールバックの中で処理を行うためややこしい見た目になりがちです
Promiseチェーンで`fetchResources`関数書いた場合は、コールバックの中で処理するためややこしい見た目になりがちです
一方、Async Functionと`await`式で書いた場合は、取得と追加を順番に行うだけとなりネストがなく見た目はシンプルです。

このようにAsync Functionと`await`式でも非同期処理を同期処理のような見た目で書けます。
Expand Down
10 changes: 5 additions & 5 deletions source/basic/class/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -317,7 +317,7 @@ console.log(counterA.increment === counterB.increment); // => true

`class`構文でのメソッド定義はプロトタイプメソッドとなり、インスタンス間で共有されます。

一方、クラスのインスタンスに対して直接メソッドを定義することも可能です
一方、クラスのインスタンスに対して、直接メソッドを定義する方法もあります
これは、コンストラクタ関数内でインスタンスオブジェクトに対してメソッドを定義するだけです。

次のコードでは、`Counter`クラスのコンストラクタ関数で、インスタンスオブジェクトに`increment`メソッドを定義しています。
Expand Down Expand Up @@ -629,7 +629,7 @@ const arrayWrapper = ArrayWrapper.of(1, 2, 3);
console.log(arrayWrapper.length); // => 3
```

このように静的メソッドでの`this`はクラス自身を参照するため、インスタンスメソッドのようにインスタンスを参照することはできません
このように静的メソッドでの`this`はクラス自身を参照するため、クラスのインスタンスは参照できません
そのため静的メソッドは、クラスのインスタンスを作成する処理やクラスに関係する処理を書くために利用されます。

## 2種類のインスタンスメソッドの定義 {#two-instance-method-definition}
Expand Down Expand Up @@ -939,10 +939,10 @@ const child = new Child("引数1", "引数2");
// "Childコンストラクタの処理", "引数1", "引数2"
```

`class`構文でのクラス定義では、`constructor`メソッド(コンストラクタ)で何も処理を行わない場合は省略できることを紹介しました
`class`構文でのクラス定義では、`constructor`メソッド(コンストラクタ)で何も処理しない場合は省略できることを紹介しました
これは、継承した子クラスでも同じです。

次のコードでは、`Child`クラスのコンストラクタでは何も処理を行っていません
次のコードの`Child`クラスのコンストラクタでは、何も処理を行っていません
そのため、`Child`クラスの`constructor`メソッドの定義を省略できます。

{{book.console}}
Expand Down Expand Up @@ -971,7 +971,7 @@ class Child extends Parent {
子クラスのコンストラクタでは、`this`を触る前に`super()`で親クラスのコンストラクタ処理を呼び出さないと`SyntaxError`となるためです。

次のコードでは、`Parent`と`Child`でそれぞれインスタンス(`this`)の`name`プロパティに値を書き込んでいます。
子クラスでは先に`super()`を呼び出してからでないと`this`を参照することはできません
子クラスでは先に`super()`を呼び出してからでないと`this`を参照できません
そのため、コンストラクタの処理順は`Parent`から`Child`という順番に限定されます。

<!-- textlint-enable no-js-function-paren -->
Expand Down
2 changes: 1 addition & 1 deletion source/basic/comments/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -69,4 +69,4 @@ ECMAScriptは一度入った仕様が使えなくなることは殆どないた

[Annex B (normative)]: http://www.ecma-international.org/ecma-262/6.0/#sec-additional-ecmascript-features-for-web-browsers
[ES6 In Depth: Arrow functions]: https://dev.mozilla.jp/2016/03/es6-in-depth-arrow-functions/ "ES6 In Depth: Arrow functions | Mozilla Developer Street (modest)"
[JSDoc]: https://ja.wikipedia.org/wiki/JSDoc
[JSDoc]: https://ja.wikipedia.org/wiki/JSDoc
4 changes: 2 additions & 2 deletions source/basic/condition/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ if (x > 10) {
```

if文の`条件式`には`true`または`false`といった真偽値以外の値も指定できます。
真偽値以外の値の場合、その値を暗黙的に真偽値へ変換した評価結果を使い、if文の判定を行います
真偽値以外の値の場合、その値を暗黙的に真偽値へ変換してから、条件式として判定します

真偽値へ変換した結果が`true`となる値の種類は多いため、逆に変換した結果が`false`となる値を覚えるのが簡単です。JavaScriptでは次の値は`false`に変換され、これらの値は**falsy** と呼ばれます。(「[暗黙的な型変換][]の章」を参照)

Expand Down Expand Up @@ -253,4 +253,4 @@ switch文のcase節では基本的に`break;`を使いswitch文を抜けるよ
- [制御フローとエラー処理 - JavaScript | MDN](https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Control_flow_and_error_handling)


[暗黙的な型変換]: ../implicit-coercion/README.md
[暗黙的な型変換]: ../implicit-coercion/README.md
10 changes: 5 additions & 5 deletions source/basic/data-type/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ JavaScriptは動的型付け言語に分類される言語であるため、
データ型を大きく分けると、**プリミティブ型**と**オブジェクト**の2つに分類されます。

プリミティブ型(基本型)は名前のとおり、文字列や数値などの基本的な値の型のことです。
プリミティブ型の値は、一度作成したらその値自体を変更することはできないというイミュータブル(immutable)の特性を持ちます。
プリミティブ型の値は、一度作成したらその値自体を変更できないというイミュータブル(immutable)の特性を持ちます。

一方、プリミティブ型ではないものをオブジェクト(複合型)とよび、
オブジェクトは複数のプリミティブ型の値またはオブジェクトからなる集合です。
Expand Down Expand Up @@ -45,7 +45,7 @@ JavaScriptは動的型付け言語に分類される言語であるため、
他のプリミティブ型の値については、`typeof`演算子でそれぞれのデータ型を調べることができます。

オブジェクトと一言にいってもJavaScriptではすべてがオブジェクトであると言われるほど、多くの種類が存在します。
`typeof`演算子ではすべてのオブジェクトの種類を判定することはできません
`typeof`演算子ではすべてのオブジェクトの種類を判定できません

つまり、`typeof`演算子は、プリミティブ型またはオブジェクトかを判別するもので、
オブジェクトの詳細なデータ型については別の方法を判定するようになっています。
Expand Down Expand Up @@ -177,7 +177,7 @@ PHPやRubyなどとは違い、どちらのリテラルでも評価結果は同
"8 o'clock"; // => "8 o'clock"
```

ダブルクオートとシングルクオートどちらも改行をそのまま入力することはできません
ダブルクオートとシングルクオートどちらも、改行をそのままは入力できません
次のように改行を含んだ文字列は定義できずに構文エラー(`SyntaxError`)となります。

[import, multiple-line-string-invalid.js](src/multiple-line-string-invalid.js)
Expand Down Expand Up @@ -348,8 +348,8 @@ const numberRegExp = /\d+/; // 1文字以上の数字にマッチする正規表
console.log(numberRegExp.test(123)); // => true
```

`RegExp`コンストラクタを使うことで文字列から正規表現オブジェクトを作成することもできますが、
特殊文字の二重エスケープが必要になり直感的に書くことが難しくなります。
`RegExp`コンストラクタを使うことで、文字列から正規表現オブジェクトを作成できます。
しかし、特殊文字の二重エスケープが必要になり直感的に書くことが難しくなります。

正規表現オブジェクトについて詳しくは、[文字列の章][]で紹介します。

Expand Down
4 changes: 2 additions & 2 deletions source/basic/ecmascript/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ author: azu
ここまでJavaScriptの基本文法について見ていきましたが、その文法を定めるECMAScriptという仕様自体がどのように変化していくのかを見ていきましょう。

ECMAScriptは[Ecma International][]という団体によって標準化されている仕様です。
Ecma InternationalはECMAScript以外にもC#やDartなどの標準化作業を行っています
Ecma InternationalはECMAScript以外にもC#やDartなどの標準化作業をしています
Ecma International中のTechnical Committee 39(TC39)という技術委員会が中心となって、ECMAScript仕様についてを議論しています。
この技術委員会はMicrosoft、Mozilla、Google、AppleといったブラウザベンダーやECMAScriptに関心のある企業などによって構成されます。

Expand Down Expand Up @@ -97,7 +97,7 @@ ECMAScriptの策定プロセスのステージ4に「2つ以上の実装が存
またTranspilerやPolyfillといった手段で、プロポーザルの機能をエミュレートできる場合があります。

Transpilerとは、新しい構文を既存の機能で再現できるようにソースコードを変換するツールのことです。
たとえば、ES2015で`class`構文が導入されましたが、ES5では`class`は予約語であるため構文エラーとなり実行することはできません
たとえば、ES2015で`class`構文が導入されましたが、ES5では`class`は予約語であるため構文エラーとなり実行できません
Transpilerでは、`class`構文を含むソースコードを`function`キーワードを使い擬似的に再現するコードへ変換します。
Transpilerとしては[Babel][]や[TypeScript][]などが有名です。

Expand Down
Loading