回答:
Chromeでは、ほとんどのES6機能が「実験的なJavaScript機能」と呼ばれるフラグの後ろに隠されています。にアクセスしchrome://flags/#enable-javascript-harmony
、このフラグを有効にしてChromeを再起動すると、多くの新機能を利用できます。
矢印関数はV8 / Chromeではまだ実装されていないため、このフラグは矢印関数を「ロック解除」しません。
矢印関数は構文の変更であるため、JavaScriptの解析方法を変更せずにこの構文をサポートすることはできません。ES6での開発が好きな場合は、ES6コードを記述し、ES6からES5へのコンパイラを使用して、既存の(最新の)すべてのブラウザと互換性のあるJavaScriptコードを生成できます。
たとえば、https://github.com/google/traceur-compilerを参照してください。執筆時点では、ES6のすべての新しい構文機能をサポートしています。この回答の上部に記載されているフラグと共に、希望する結果に非常に近くなります。
ES6構文をコンソールから直接実行する場合は、コンソールのJavaScriptエバリュエーターを上書きしてみてください(コードを実行する前にTraceurプリプロセッサーが実行されるようにするなど)。これを行うのが好きな場合は、この回答を見て、開発者ツールの動作を変更する方法を学んでください。
class
たとえば、構文のように。
--enable-javascript-harmony
フラグが設定されている/(?<!a)b/.test('ab')
場合、次のコードはfalseを返します(フラグが設定されていない場合は次のエラーをスローします: "Uncaught SyntaxError:Invalid regular expression:/(?<!a)b /:Invalid group")
BabelはES6を試すのに最適なトランスパイラーです。ES6は、Webサイトの「試してみる」セクションにあるブラウザーで実行できます。jsfiddleと同様に機能します。
矢印の例:
let add = (x,y) => x + y;
let result = add(1,1);
console.log(result);
結果を表示します 2
。
ES6を現在のブラウザテクノロジーで実行できるES5 JavaScriptに変換するBabelの「トランスパイル」。Babelはからインストールできnpm install -g babel
ます。インストールしたら、上の矢印の例をファイルに保存できます。ファイルを「ES6.js」と呼びます。ノードがインストールされているとすると、コマンドラインで出力をノードにパイプします。
babel ES6.js | node
そして、あなたは出力を見るでしょう2
。次のコマンドを使用して、翻訳したファイルを永続的に保存できます。
babel ES6.js --out-file output.js
output.js "transpiled":
"use strict";
var add = function (x, y) {
return x + y;
};
var result = add(1, 2);
console.log(result);
もちろん、どれを最新のブラウザでも実行できます。
ES6は動きの速いターゲットです。TraceurやBabelなどのトランスパイラでサポートされている機能とブラウザサポートについては、互換性テーブルを参照してください。チャートを展開して、互換性の確認に使用されるテストを表示することもできます。
ブラウザで最先端のES6を試すには、FirefoxナイトリービルドまたはChromeリリースチャネルをお試しください
次のリンクのいずれかを探している可能性があります。
開発パイプラインでBabelを使用すると、JavaScriptが自動的にトランスパイル(変換)され、クロスブラウザー互換になります。または、TypeScriptを使用している場合は、安心できます。コードは既に変換されています。
トランスパイラー(Babel / Typescriptなど)をセットアップしたくない、またはトランスパイラーでまだサポートされていない機能を試してみませんか?
ブラウザで試験的なECMAScript機能を有効にするには、chrome:// flags /#enable-javascript-harmonyに移動してJavaScript Harmonyフラグを有効にします。一部の機能では、JavaScriptハーモニーフラグを有効にしてChrome Canaryを使用する必要がある場合があります。
新しいJavaScript APIは通常Babelの対象ではなく、独自のChromeフラグを持っています。
この質問は、矢印関数を使用して具体的に説明されています。アロー関数は、IEとOpera Miniを除くすべてのブラウザーでネイティブにサポートされるようになりました。caniuseを参照してください。
アロー機能を操作したい場合は、少し難しいものでした。以下の履歴は、この機能を使用するためにさまざまな時点で要したことを示しています。
1)最初は、矢印機能は、フラグが有効になっているChrome Canaryで のみ機能し
chrome://flags/#enable-javascript-harmony
ました。この機能はバージョン39 で少なくとも部分的に実装されたようです。2)次に、Google Chrome でJavaScript Harmonyフラグの背後にある矢印関数が使用可能になります。
3)最後に、Google Chrome 45では、矢印はデフォルトで有効になっています。
他の新しいECMAScript機能でも同様のパターンが発生することが期待できます。
ただ、使用使用厳格な閉鎖へ、モードを(必要ではないが、それは偉大なアプローチだ)とChromeはES6として、あなたのコードを実行することができるようになります...
(function(){
'use strict';
//your ES6 code...
})();
ここに例があります... http://jsbin.com/tawubotama/edit?html,js,console,output use stric mode行を削除してもう一度試してください。コンソールのエラーがログに記録されます。
2015年11月の時点で、FirefoxとEdgeがES6レースをリードしてきました。Chromeにない機能を実験したい場合は、それらを使用してください。Edgeにはクラス/サブクラスがあり、FirefoxにはProxyがあります。それらの間には、実質的にすべてのES6機能があります。
ChromeコンソールでES6を使用する必要がある場合、シンプルで試行錯誤した真の方法が1つあります。
我慢して。
ブラウザはES6を採用しています。ほとんどのHTML5標準に足を踏み入れてきたSafariもそうです。Googleに時間を与えれば、ES6の機能が1つずつ実装されます。たとえば、矢印機能は現在、生産チャネルでフラグなしで利用できます。
拡張を期待しないでください。ES6を1行ずつES5に変換することはできないため、コンソールをBabelで拡張することはできません。
実験jsフラグがあることは事実ですが、それは正当な理由で存在しています。V8にはプロキシがありますが、古い(非標準)構文であり、セキュリティ上の問題があります。その破壊も不完全です。場合によっては機能し、場合によっては機能しないことがあります。
ES6をプレイしたいだけなら、単にEdge / Firefoxでプレイしてください。どちらもBabelのほぼ全体をカバーし、コンソールとデバッガーを備え、Babelが提供できない機能を備えています。