JavaScriptの備忘録(ES5らへん、適当)

##備忘録として
オレオレ定義なJavaScriptのメモ
※ただしOOPも意味論（インスタンスベースとクラスベース）によって解釈が変わるため注意

##基本

###変数・関数・値
|項目|値|
|---|---|
|関数|データの処理|
|変数|データの名前|
|値|データの実態|

###演算子
|項目|値|
|---|---|
|算術演算子|+, -, \*, /, ^, %など|
|論理演算子|!, !!, &&, &#124;&#124;など|
|比較演算子(関係演算子)|<=, >=, >, <, ==, !==など|
|代入演算子|+=, -=など|
|二項演算子、三項演算子|(式) ? (式) : (式);など|
|アロー演算子|->のこと(ES6)|
|インクリメント/デクリメント演算子|++,--など。計算を代入前に行う前置と、計算後に行う後置がある。|
| ビット演算子 | &, &#124;, ^, ~, >>, <<, >>>など  |  

###構文
|項目|値|
|---|---|
|繰り返し構文|for, whileなど|
|条件分岐文|if, switchなど |

###データ型
|項目|値|
|---|---|
|String|文字列、プリミティブ|
|Number|数値、小数も、プリミティブ|
|Boolean|論理型、プリミティブ|
|Array|配列、参照型|
|Object|連想配列、参照型|
|Function|関数型、functionは第一級関数|
|null|データ型はあるがデータはない、実際はObject型|
|undefined|データが無いためデータ型がない|
|NaN|非数型、特殊なデータ型、実際はNumber型|
|Date|日付型、実際はFunction型 |
|Error|エラー型、実際はFunction型|

※ただし、プリミティブ型とクラス型の区別はなく、
オートボクシング（即値型からの参照型の変換）などが強烈に働くので意識する必要なし。

###データ構造
|項目|値|
|---|---|
|オブジェクト|連想配列や二次配列やらマップ、ハッシュ、辞書とも|
|コレクション|オブジェクトの配列|

##OOP
###基本
|項目|値|
|---|---|
|オブジェクト|インスタンスの総称。JSではUndefined型以外のインスタンスの始祖はObject|
|インスタンス |データの実体。クラスから生成される。constructorプロパティには暗黙的にコンストラクタが入る|
|クラス|インスタンスを生成するもの。データ型やデータ構造をもつ。ES5にはない。代わりにコンストラクタを使う|
|クラスの継承| クラスが無いが似た方法は色々ある(http://qiita.com/cocottejs/items/e75f751c7aa8a7361aab)|
|コンストラクタ| JSではnewした関数をコンストラクタと呼ぶ。コンストラクタのthisはインスタンスのthisになる|
|インスタンス化 |インスタンス化すると、継承先のインスタンスには\_\_proto\_\_に継承元のコンストラクタの実態とprototypeの参照が渡される|
|プロトタイプ | ここを(https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages) |

###メンバ
|項目|値|
|---|---|
|メンバ変数（プロパティ、フィールド）|クラスや狭義のオブジェクト内の変数のこと|
|メンバ関数（メソッド）|クラスや狭義のオブジェクト内の関数のこと。ただし、オブジェクトのプロパティに大概無名関数を生やすため、厳密にはプロパティでもある|

###アクセス権限
|項目|値|
|---|---|
|プライベートメンバ|インスタンス外からアクセスできないメンバ。ES5にはそんなのは無いが、コンストラクタ内でvar宣言した変数や関数のことをそう読んでいる（これはprototypeや継承できないが）。詳しくはここ（http://blog.tojiru.net/article/238901975.html）|
|パブリックメンバ|コンストラクタ内でthisで宣言したメンバか、コンストラクタのprototypeで拡張したもの|
|アクセサ|Getter, setterは一応ある。例えば、\_\_proto\_\_などで使われている|
|インデグサ||

###共有
|項目|値|
|---|---|
|スタティックメンバ（≈クラスメンバ）|クラスのメンバ。JSでは基本的にはコンストラクタのプロパティ。ただし、prototypeメンバは全てのインスタンスで共有されるため、それもクラスメンバっぽくもある|
|ダイナミックメンバ（≈インスタンスメンバ）|インスタンスのメンバ。JSでは基本的にはコンストラクタの内部でthisで宣言したプロパティか、コンストラクタのprototypeを拡張したプロパティ|
|prototypeメンバ（≈インスタンスメンバ、≈クラスメンバ）| コンストラクタのprototypeで拡張したプロパティ。そのコンストラクタをnewした後は全てのインスタンスで共有される。thisはインスタンス自身を指すが、参照はクラスにあるのでクラスメンバっぽくもある。|

###特殊メンバ
|項目|値|
|---|---|
|コンストラク| 関数は実行時にnewするとコンストラクタになる。頭字語は大文字が慣行|
|デストラクタ|ない|

##関数的な
###クロージャー（関数閉包・変数閉包)
|項目|値|
|---|---|
|変数閉包(オブジェクト) | オブジェクのプロパティがthisを使ってglobalから自分を呼ぶことを、勝手に僕はそう読んでいる|
|関数閉包(クロージャー)|関数が関数のスコープを超えて変数を操作できること、すること|


###スコープ(参照可能範囲)
|項目|値|
|---|---|
|スコープ|jsではブロックではなく関数が変数や関数のスコープとなる|
|レキシカルスコープ|JSはすべて静的なスコープ。呼び出し可能な参照範囲は定義時に決まる。|
|グローバルスコープ|window, global|
|ローカルスコープ|関数内のスコープ。即時無名関数を使ったりする(function(){}())|

###コンテキスト（変数の値）
|項目|値|
|---|---|
|関数コンテキスト|関数のthisの文脈のこと|
|関数シグネチャ|関数の関数名や引数などのこと|
|4つのthisパターン|関数( ()パターン)<br>インスタンス(newパターン)<br>Apply/call（apply/callパターン）<br>メソッドパターン（ドットパターン）|

###チェーン
|項目|値|
|---|---|
|プロトタイプチェーン（≈クラスチェーン）| もしインスタンスのプロパティが見つからない場合は\_\_proto\_\_を遡り探すこと。　|
|スコープチェーン|変数の名前解決のこと。詳しくは（http://maeharin.hatenablog.com/entry/20130313/javascript_scopechain）|
|メソッドチェーン| メソッドが自分自身のインスタンスを返すパターン。メソッドを繋げられる|


##フェーズ
###ランタイムのフェーズ
|項目|値|
|---|---|
|定義|JavaScriptエンジンによって構文解析されるフェーズ|
|参照|記述式を使って、変数や関数や値（リテラル）などのエンティティの参照を渡す行為。|
|発火（実行）|関数を実行するとき、発火する。この後、ハンドラ（handler）はFIFOのキューにキューイングされる。（メモリにアロケート）|
|処理（実行）|発火した関数をハンドル(handle)すること。キューに登録されたハンドラはスレッドで処理（ハンドル）される。|
|Note|JavaScriptは実行時毎にローカル変数が作成される。即時関数は定義時に実行される。ガベージコレクションのタイミングは以下を見る。http://www.html5rocks.com/ja/tutorials/speed/static-mem-pools/|

###イベントのフェーズ
|項目|値|
|---|---|
|キャプチャフェイズ|ルートからターゲット要素への伝播|
|バブルフェイズ|ターゲット要素からルートへのイベントの伝播。キャプチャフェイズの後に起こる |
|抑制方法|stopPropagation()でイベントの伝播を止められ、preventDefault()でターゲット要素の既定アクションを中止できる|


##デザインパターン

###プログラムデザインパターン(GoF)
|項目|値|
|---|---|
|||


###ビューのデザインパターン
|項目|値|
|---|---|
|仮想DOM| Reactとかの概念ではなく、backboneのviewを使ったような自分でDOMを作成することを僕は指す|
|仮想DOMツリー|Viewが複数イベントを購読・発行する形で連携する仮想的なDOMツリー。以下の２つのパターンがある|
|仮想DOMツリーのルート|Fluxっぽく、ルートでは基本的にDOMの状態を管理する。子のイベントなども管理する。そのため、特に小ビューはステートレスになり、再利用正が上がる|
|ビューベースのイベントパターン|ビューベースのイベントドリブンのデザインパターン。インスタンスベースのOOPみたいな感じ。小ビューのモデルは別々のモデルを使うため親ビューへの参照をベースに小ビューが伝播しあう|
|モデルベースのイベントパターン|モデル（コレクション）ベースのイベントドリブンのデザインパターン。クラスベースのOOPみたいな感じ。小ビューのモデルは同じモノを使うためモデルを参照し小ビューが伝播しあう|
|同期的描写のパターン|基本的には同期的な処理（URLによって一意に初回の表示処理がサーバーサイドで決まる）パターンではコントローラーに定義したモデルをルートから小ビューに流し込む|
|非同期的描写のパターン|基本的には非同期的な処理（URLによって一意に初回の表示処理がサーバーサイドで決まらない）パターンでは、仮想DOMツリーをマウントして２つのルートを用意する|

##その他
|項目|値|
|---|---|
|ホスティング（巻き上げ）|ローカル変数の宣言はスコープ先頭で行ったことになる。つまり、JSではローカル変数は必ず最初に巻き上げられて宣言される。|
|グローバル変数は強制的にグローバルオブジェクトのプロパティとなる|ブラウザ側ではwindowオブジェクト。例えばグローバルスコープでvarを宣言セずにやるとthisとなる。|

## 参考文献
https://msdn.microsoft.com/ja-jp/library/7wkd9z69(v=vs.94).aspx
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Loops_and_iteration
http://kudox.jp/java-script/js-oop-class