es 6(初級)

5559 ワード

引用:
ECMAScriptとJavaScriptの関係は前者が後者の規格であり、後者が前者の実現(他のECMAScript方言にはJScriptとアクションScriptがあります)です.日常の場面では、この2つの単語は交換できます.
ES 6は歴史名詞であり、一般的な意味でもあります.5.1版以降のJavaScriptの次世代基準を意味し、ES 2015、ES 2016、ES 2017などを含みます.ES 2015は正式名称で、その年に発表された正式バージョンの言語基準を指すものです.この本でES 6というところは、一般的にES 2015標準を指していますが、「次世代JavaScript言語」を指す場合もあります.
ベベル は、広く使われているES 6トランスコーダであり、ES 6コードをES 5コードに変換して、既存の環境で実行することができる.(Google社のTraceurトランスコーダは、ES 6コードをES 5コードに変換することもできます.Traceurは、ES 6コードを直接ウェブページに挿入することができます.Traceurはオンラインコンパイラも提供しています.ES 6コードをES 5コードにオンライン変換することができます.)
1.変数とスコープ
var  繰り返し宣言することができます.変更を制限することができません.ブロックレベルのスコープがありません.すなわち{}
let:繰り返し宣言できません.変数-変更できます.ブロックレベルのスコープ、
const:繰り返し宣言できません.定数-変更できません.ブロックレベルのスコープ
注:letコマンドには変数のアップグレードがありません.宣言された変数は必ず声明の後に使用します.
コードブロック内で、let,constコマンドを使用して変数を宣言する前に、この変数はすべて利用できません.これは文法的には「一時的なデッドゾーン」と呼ばれ、「一時的なデッドゾーン」もtypeofがもはや100%の安全な動作ではないことを意味する.letは同じスコープ内で同じ変数を繰り返し宣言することを許さない.forサイクルにはもう一つの特別な点があります.循環変数を設定する部分は父作用領域であり、循環体内部は単独の副作用領域です.
ES 5は、関数が最上位のスコープと関数スコープの中でしか宣言できないと規定しています.ブロックレベルのスコープ宣言ではできません.(ただし、ブラウザはこの規定を遵守していません.従来のコードに対応するため、ブロックレベルのスコープ内の宣言関数をサポートします.)
ES 6はブロックレベルのスコープを導入し、ブロックレベルのスコープ内の宣言関数を明確に許可する.ES 6は、ブロックレベルのスコープ内の関数ステートメントの動作は、ブロックレベルのスコープ外では参照できないletと同様であると規定している.
2.矢印関数:
function hashu(){}は  Functionを外して=>を加えます.
()=>{}
パラメータは一つしかありません.省略できます.()
一つのreturnだけあって、省略できます{}
3.関数のパラメータ:
a.パラメータ拡張(パラメータ収集-最後のパラメータrest parameter、展開配列が必要)
b.デフォルトパラメータ:function hashu(a,b=10,c=5){}   つまり、パラメータが伝えられたら、伝えるパラメータを基準とし、伝えないならデフォルトの値を基準とします.
4.構成値:
左右の構造が一致していて、右側は必ずものでなければなりません.
配列、json、配列対象文字列などのネストはすべて値を分解します.let{a,b,c}={a:1,b:2,c:3}
let[{a,b],[n 1,n 2,n 3],num,str]=[{a:10,b:13],[1,2,3],56,'qwer']は、粒度を制御することができます.即ち、出力形態を制御します.
let[obj,arr,num,str]=[{a:10,b:13],[1,2,3],56,'qwer'-----出力はjsonと配列形式です.
完全には構成されていません.すなわち、等号の左側のモードは、一部の等号の右の配列にのみマッチします.このような状況では、解構は依然として成功している.
構成を解除すると、デフォルトの値を指定できます.デフォルトの値は、他の変数の構成を参照することができますが、変数はすでに宣言されている必要があります.
オブジェクトのプロファイルは、既存のオブジェクトの方法を、ある変数に簡単に割り当てることができます.
オブジェクトの構造解除の内部メカニズムは、最初に同じ名前の属性を見つけ、その後に対応する変数を割り当てます.本当に与えられたのは後者で、前者ではない.(なお、オブジェクトの構成解除値は、引き継ぎの属性を取ることができます.)
オブジェクトの構文化は、標準値を指定することもできます.標準値が有効になる条件は、オブジェクトの属性値が厳密にundefinedに等しいことです.
宣言された変数を構成を解除するには、非常に注意が必要です.
//      
let x; {x} = {x: 1}; // SyntaxError: syntax error 
上のコードの書き方は間違えます.JavaScriptエンジンは{x}をコードブロックとして理解し、文法エラーが発生します.大きな括弧を行頭に書かない限り、JavaScriptがコードブロックと解釈しないようにしてこそ、この問題を解決できます.
//      
let x; ({x} = {x: 1}); 
上のコードは全体の構文を丸括弧の中に入れて、正しく実行できます.
文字列は、値の割り当てを解除することもできます.このとき、文字列は同じ配列のオブジェクトに変換されるからです.同じ配列のオブジェクトにはlength属性があるので、この属性に対しても値を分解することができる.
値を解くときは、等号の右側が数値とブール値であれば、まずオブジェクトに変換します.値を分解する規則は、等号の右の値がオブジェクトや配列でない限り、まずオブジェクトに変換します.undefinedおよびnullはオブジェクトに変換できないので、それらを構成解除してもエラーが発生します.
5.関数の解像力:
関数のパラメータは、デフォーカシング値を使用することもできます.関数パラメータの構成は、標準値を使用してもよく、関数パラメータ自体がデフォルト値を設定しても良いです.関数のパラメータは、配列オブジェクトとすることができます.
割り当ての用途:
1.変数の値を交換する
2.関数から複数の値を返します.
3.関数パラメータの定義
4.jsonオブジェクトからデータを抽出する
5.関数パラメータのデフォルト値
6.map構造を巡回
7.入力モジュールの指定方法
6.文字列拡張:
ES 6は文字列にエルゴードインターフェース(詳細は「Iterator」の章を参照)を追加し、文字列がfor...ofに巡回巡回されるようにする.
テンプレート文字列(template string)は拡張版の文字列で、逆引用符(`)で表示されます.普通の文字列として使用できます.また、複数行の文字列を定義したり、文字列に変数を埋め込んだりできます.テンプレート文字列に変数を埋め込むには、${}に変数名を書き込む必要があります.大かっこの中には、任意のJavaScript表式を入れて演算したり、オブジェクトの属性を参照したりできます.すべてのテンプレート文字列のスペースと改行は、ラベルの前に改行があるなど、保持されています.この改行を望まないなら、trim方法で消してもいいです.テンプレート文字列の中で関数を呼び出すこともできます.大かっこの値が文字列でない場合は、一般的な規則に従って文字列に変換します.例えば、大かっこの中にはオブジェクトがあり、標準的にオブジェクトを呼び出すtoString方法があります.テンプレート文字列の変数が宣言されていない場合、エラーが発生します.テンプレート文字列の大括弧の内部はJavaScriptコードを実行するため、大括弧の中に文字列があるとそのまま出力されます.テンプレート文字列はさらにネストされます.テンプレート文字列自体を参照する必要がある場合は、必要に応じて実行します.
テンプレート文字列の機能は、上記だけではありません.このテンプレート文字列を処理するために呼び出される関数名の後に続くことができます.これはラベルテンプレートと呼ばれる機能です.
alert`123`
//    
alert(123) 
ラベルテンプレートはテンプレートではなく、関数呼び出しの特別な形式です.ラベルとは関数のことで、後に続くテンプレート文字列はそのパラメータです.「ラベルテンプレート」の重要な応用は、HTML文字列をフィルタリングし、ユーザーが悪意のあるコンテンツを入力することを防止することです.