注意：一般的に受け入れられ練習が使用するconstループや再割り当ての場合を除いて。しかし、このリソースでは私が使うことになるletの代わりに、varすべてのES6例について。
- 変数：
x - オブジェクト：
obj - アレイ：
arr - 関数：
func - パラメータ、方法：
a、b、c - 文字列：
str
目次
- 変数宣言
- 定数宣言
- アロー関数の構文
- テンプレートのリテラル
- 暗黙のリターン
- キー/プロパティ速記
- メソッド定義速記
- 非構造（オブジェクトマッチング）
- アレイ繰り返し（ループ）
- デフォルトパラメータ
- スプレッド構文
- クラス/コンストラクタ関数
- 継承
- モジュール - エクスポート/インポート
- 約束/コールバック
変数と定数の機能比較
| キーワード | 範囲 | 巻き上げ | 再割り当てすることができます | 再宣言できます |
|---|---|---|---|---|
var |
関数スコープ | はい | はい | はい |
let |
ブロックスコープ | 番号 | はい | 番号 |
const |
ブロックスコープ | 番号 | 番号 | 番号 |
変数宣言
ES6は導入let掲揚や再宣言することはできませんブロックスコープの変数を可能にしたキーワードを、。
定数宣言
ES6は導入const再宣言または再割り当てすることができないキーワードが、しかし、不変ではありません。
アロー機能
矢印関数式の構文は、関数式を作成するための簡単な方法です。アロー機能は、独自のを持っていないthis、プロトタイプを持っていない、コンストラクタのために使用することはできない、とオブジェクトのメソッドとして使用すべきではありません。
＃1 ES5の
関数func（A、B、C）{} //関数宣言
するvar FUNC =関数（A、B、C）{} //関数発現
＃ES6は
//一つで任意括弧FUNC = A => {}せパラメータ
複数のパラメータを有する必要せFUNC =（A、B、C）=> {} //括弧
テンプレートリテラル（テンプレートテキスト）
連結/文字列補間
式は、テンプレートリテラル文字列に埋め込むことができます。
＃1 ES5の
VAR STR = '発売日：' +日付
＃ES6
せSTR = `発売日：$ {日付}`
複数行の文字列
テンプレートリテラル構文を使用して、JavaScriptの文字列は連結を必要とせずに、複数行にまたがることができます。
＃ES5の
するvar strが= 'このテキスト' + + '複数行' 'には'
＃ES6
せSTR = `このテキストは、
上にある
複数のlines`
注意：空白は複数行のテンプレートリテラルに保存されています。参照してくださいES6テンプレート文字列で先頭の空白を削除します。
暗黙のリターン
returnキーワードが暗示され、ブロック体なしで矢印の機能を使用している場合は省略することができます。
＃1 ES5の
関数func（A、B、C）{
+ B + C戻り
}
＃ES6を
funcが=（A、B、C）=> A + B + C //中括弧を省略しなければならないせ
キー/プロパティ速記
ES6は、同じ名前の変数にプロパティを割り当てるための短い表記法を紹介します。
＃1 ES5の
VAR OBJ = {
：、
B：B、
}
＃ES6を
せOBJ = {
、
B、
}
メソッド定義速記
functionオブジェクトのメソッドを割り当てるときキーワードを省略することができます。
＃1 ES5の
VAR OBJ = {
：関数（C、D）{}、
B：関数（E、F）{}
}
＃ES6を
せOBJ = {
（C、D）{}、
B（E、F） {}
}
obj.a（）//呼び出し方法a
非構造（オブジェクトマッチング）
自分の変数にオブジェクトのプロパティを割り当てるために波括弧を使用してください。
VAR OBJ = {1、B 2、C 3}
＃ES5
ありOBJ。A =
はいB = obj.b
有するC = obj.c
＃ES6
せ、{A、B、C} = OBJ
アレイ繰り返し（ループ）
より簡潔な構文は、配列やその他の反復可能なオブジェクトの繰り返し処理のために導入されました。
VAR ARR = [ 'A'、 'B'、 'C']
＃1 ES5
ため（VAR i = 0; iはarr.lengthを<; Iは++）{
にconsole.log（ARR [I]）
}
＃1 ES6
（IしましょうためARRの）{
にconsole.log（I）
}
デフォルトパラメータ
関数は、引数が関数によって呼び出されない場合にのみ使用されるデフォルトのパラメータで初期化することができます。
＃ES5の
VARのFUNC =関数（a、b）は、{
B = B ===未定義？2：B
+ B戻り
}
＃ES6が
FUNC =（B = 2）=> {せ
+ B戻り
}
12返す// FUNC（10）
// 15を返す（5、10）FUNCを
スプレッド構文
スプレッド構文は、アレイを拡張するために使用することができます。
＃ES6は ARR1は= [1、2、3]せ [ 'C'、 'A'、 'B'] ARR2 =をさせ ましょうARR3 = [... ARR1、ARR2 ...] にconsole.log（ARR3）// [1、2、3、 "A"、 "B"、 "C"]
スプレッド構文は、関数の引数のために使用することができます。
＃ES6は ARR1は= [1、2、3]せ ましょうFUNC =（A、B、C）=> A + B + C はconsole.log（FUNC（...はARR1））// 6
クラス/コンストラクタ関数
ES6はintroducess classプロトタイプベースのコンストラクタ関数の上に構文を。
＃1 ES5の
機能のFunc（B）{
this.a = A
this.b = B
}
Func.prototype.getSum =関数（）{
this.a + this.b戻り
}
VAR X =新規のFunc（3、4）
＃ES6の
クラスのFunc {
コンストラクタ（B）{
this.a = A
this.b = B
}
getSum（）{
戻りthis.a + this.b
}
}
せて、X =新規のFunc（3、4）
x.getSum （）// 7を返します。
継承
extendsキーワードは、サブクラスを作成します。