ECMAScript 6概要

2525 ワード

今日から、阮一峰先生の『ECMAScript 6入門』を拝見します.自分で計画を立てて、毎日の章を固定することを求めません.
1.ECMAScriptとJavaScriptの関係
ECMAScriptとJavaScriptの関係は前者が後者の規格であり、後者が前者の実現(他のECMAScript方言にはJscriptとアクションScriptがあります)です.日常の場面では、この2つの単語は交換できます.
2.ES 6とECMAScript 2015の関係
ECMAScript 2015(ES 2015と略称する)ES 6は歴史名詞であり、一般的には5.1版以降のJavaScriptの次世代基準を意味し、ES 2015、ES 2016、ES 2017などをカバーしているが、ES 2015は正式名称であり、特にこの年に発表された正式バージョンの言語基準を指す.ES 6といえばES 2015の標準を指すが、「次世代JavaScript言語」を指す場合もある.
3.配置の進捗
各ブラウザの最新バージョンは、ES 6に対するサポートでカングクス.githb.io/s 5-compt-table/es 6を見ることができます.時間が経つにつれて、サポート度が高くなり、90%を超えるES 6文法特性が実現されました.
4.Babelトランスコーダ
Babelは、広く使われているES 6トランスコーダであり、ES 6コードをES 5コードに変換して、既存の環境で実行することができる.これはES 6でプログラムを作成することができますし、既存の環境がサポートされているかどうかを心配する必要はありません.次は一例です.
//    
input.map(item => item + 1);

//    
input.map(function (item) {
  return item + 1;
});
プロファイル.babelrc
Babelのプロファイルは.babelrcで、プロジェクトのルートディレクトリの下に保存されています.Babelを使用する第一歩は、このファイルを配置することです.このファイルはトランスコード規則とプラグインを設定します.基本的なフォーマットは以下の通りです.
{
  "presets": [],
  "plugins": []
}
presetsフィールドはトランスコード規則を設定し、必要に応じて以下の規則セットを提供します.
#       
$ npm install --save-dev babel-preset-latest

# react     
$ npm install --save-dev babel-preset-react

#              (  4   ),    
$ npm install --save-dev babel-preset-stage-0
$ npm install --save-dev babel-preset-stage-1
$ npm install --save-dev babel-preset-stage-2
$ npm install --save-dev babel-preset-stage-3
そして、これらのルールをバーベルに加えます.
{
    "presets": [
      "latest",
      "react",
      "stage-2"
    ],
    "plugins": []
  }
まずnpm initを使ってpackage.jsonファイルを作成します.以下のBabelツールとモジュールの使用は全部書いてください.Babelrc.
コマンドライントランスコードBabel-cli
Babelは、コマンドラインのトランスコードのためにBabel-cliツールを提供します.
$ npm install --global babel-cli
使い方
#            
$ babel example.js

#           
# --out-file   -o         
$ babel example.js --out-file compiled.js
#   
$ babel example.js -o compiled.js
  
#       
# --out-dir   -d         
$ babel src --out-dir lib
#   
$ babel src -d lib

# -s     source map  
$ babel src -d lib -s
バベル-register
babel-registerモジュールはrequireコマンドを書き換えて、フックを付けます.その後、requireローディング.js、.jsx、.esと.s 6の拡張子のファイルを使うたびに、まずBabelでトランスコードします.
$ npm install --save-dev babel-register
使う時は、まずバベル-registerをロードしなければなりません.
require("babel-register")
require("