タグ付けされた質問 「ecmascript-6」

ECMAScript仕様の2015バージョン。現在は標準(ECMAScript 2015)。このタグは、質問がECMAScript 2015で提供される新機能または技術変更に特に関連する場合にのみ使用してください。

6
create-react-appを使用するReactアプリでES6機能をポリフィルするための最良の方法
私はInternetExplorerでReact.jsアプリケーションをテストしてきましたが、ES6 / 7コードのようにArray.prototype.includes()壊れていることがわかりました。 私はcreate-react-appを使用していますが、誰もが必要としているわけではないため、多くのポリフィルを含めないことを選択したようです。また、ビルド時間が遅くなります(たとえば、こことここを参照)。ドキュメント(執筆時点)は次のことを示唆しています。 ランタイムサポートが必要な他のES6 +機能(Array.from()やSymbolなど)を使用する場合は、適切なポリフィルを手動で含めるか、対象のブラウザーがすでにそれらをサポートしていることを確認してください。 だから... 「手動で」それらを含めるための最良の方法は何ですか?

7
JavaScriptでオブジェクトを反復できないのはなぜですか?
オブジェクトがデフォルトで反復できないのはなぜですか? オブジェクトの反復に関連する質問が常にあります。一般的な解決策は、オブジェクトのプロパティを反復し、その方法でオブジェクト内の値にアクセスすることです。これは非常に一般的であるため、オブジェクト自体が反復可能ではないのはなぜか疑問に思います。 ES6のようなステートメントは、for...ofデフォルトでオブジェクトに使用すると便利です。これらの機能は、{}オブジェクトを含まない特別な「反復可能なオブジェクト」でのみ使用できるため、使用するオブジェクトに対してこれを機能させるには、フープを実行する必要があります。 for ... ofステートメントは、反復可能なオブジェクト (Array、Map、Set、argumentsオブジェクトなどを含む)を反復処理するループを作成します。 たとえば、ES6ジェネレーター関数を使用します。 var example = {a: {e: 'one', f: 'two'}, b: {g: 'three'}, c: {h: 'four', i: 'five'}}; function* entries(obj) { for (let key of Object.keys(obj)) { yield [key, obj[key]]; } } for (let [key, value] of entries(example)) { console.log(key); console.log(value); for (let [key, …

5
ES6クラスで「パブリック静的フィールド」を作成するにはどうすればよいですか?
Javascriptクラスを作成していますが、Javaのようにパブリック静的フィールドが必要です。これは関連するコードです: export default class Agent { CIRCLE: 1, SQUARE: 2, ... これは私が得るエラーです: line 2, col 11, Class properties must be methods. Expected '(' but instead saw ':'. ES6モジュールはこれを許可していないようです。目的の動作を取得する方法はありますか、それともゲッターを作成する必要がありますか?

4
ブラウザのES6モジュール:Uncaught SyntaxError:予期しないトークンのインポート
私はへの新たなんだES6(ECMAScriptの6)、と私はその使用したいモジュールシステムをブラウザに。ES6はFirefoxとChromeでサポートされていると読みましたが、次のエラーが発生します。export Uncaught SyntaxError: Unexpected token import test.htmlファイルがあります <html> <script src="test.js"></script> <body> </body> </html> およびtest.jsファイル 'use strict'; class Test { static hello() { console.log("hello world"); } } export Test; どうして?

5
ES6:条件付きおよび動的インポートステートメント
条件付き 以下のような条件付きインポートステートメントを持つことは可能ですか? if (foo === bar) { import Baz from './Baz'; } 上記を試しましたが、コンパイル時に(Babelから)次のエラーが発生します。 'import' and 'export' may only appear at the top level 動的 以下のような動的インポートステートメントを持つことは可能ですか? for (let foo in bar) { if (bar.hasOwnProperty(foo)) { import Baz from `./${foo}`; } } 上記は、コンパイル中にBabelから同じエラーを受け取ります。 これは可能ですか、それとも私が欠けているものがありますか? 推論 私がこれを行おうとしている理由は、私が多くの「ページ」に対して多くのインポートを持っており、それらが同様のパターンに従っているためです。動的なforループを使用してこれらのファイルをインポートすることにより、コードベースをクリーンアップしたいと思います。 これが不可能な場合、ES6で多数のインポートを処理するためのより良い方法はありますか?

4
ES6テンプレートリテラルと連結文字列
Ecma-Script-6の次のコードがあります template literals let person = {name: 'John Smith'}; let tpl = `My name is ${person.name}.`; let MyVar="My name is "+ person.name+"."; console.log("template literal= "+tpl); console.log("my variable = "+MyVar); 出力は次のとおりです。 template literal= My name is John Smith. my variable = My name is John Smith. これはフィドルです。正確な違いを検索しようとしましたが、見つかりませんでした。私の質問は、これら2つのステートメントの違いは何ですか。 let tpl = `My …

5
キーワード「const」は値を不変にしません。どういう意味ですか?
ありますconstの定義でES6を探る博士アクセルRauschmayerでは: constletのように機能しますが、宣言する変数はすぐに初期化する必要があり、後で変更できない値を使用します。[…] const bar = 123; bar = 456; // TypeError: `bar` is read-only それから彼は書いています 落とし穴:constは値を不変にしません const 変数が常に同じ値を持つことを意味するだけですが、値自体が不変である、または不変になることを意味するわけではありません。 私はこの落とし穴と少し混乱しています。const誰かがこの落とし穴でを明確に定義できますか?

12
エラー:ディレクトリ「/ Users / username」に対してプリセット「es2015」が見つかりませんでした
gulp-babelを使おうとすると、次のエラーが発生します。 エラー:ディレクトリ「/ Users / username」に対してプリセット「es2015」が見つかりませんでした es2015プリセットをグローバルおよびローカルにインストールしているので、これが問題になる理由がわかりません。 以下は私のgulpのセットアップとpackage.jsonです。 var babel = require('gulp-babel'); var es2015 = require('babel-preset-es2015'); gulp.task('babel', function() { return gulp.src('./app/main.js') .pipe(babel({ presets: [es2015] })) .pipe(gulp.dest('dist')); }); Package.json "devDependencies": { "babel-preset-es2015": "^6.3.13", "babel-preset-es2015-node5": "^1.1.1", "browser-sync": "^2.11.0", "gulp": "^3.9.0", "gulp-babel": "^6.1.1", "gulp-stylus": "^2.2.0" } ノードv5.1.0とbabelv6.4.0を使用しています これがターミナル出力です 端子出力

6
ES6のマップとオブジェクト、いつ使用するか?
参照:MDNマップ キーが実行時まで不明であり、すべてのキーが同じタイプであり、すべての値が同じタイプである場合は、オブジェクト上でマップを使用します。 個々の要素を操作するロジックがある場合は、オブジェクトを使用します。 質問: オブジェクト上でマップを使用する適切な例は何ですか?特に、「実行時までキーが不明になるのはいつですか?」 var myMap = new Map(); var keyObj = {}, keyFunc = function () { return 'hey'}, keyString = "a string"; // setting the values myMap.set(keyString, "value associated with 'a string'"); myMap.set(keyObj, "value associated with keyObj"); myMap.set(keyFunc, "value associated with keyFunc"); console.log(myMap.get(keyFunc));

6
配列からオブジェクトを作成する
配列のリストからオブジェクトを作成したい。私は次のように見えると思われる動的な配列を持っています: var dynamicArray = ["2007", "2008", "2009", "2010"]; そして、いくつかのjavascript es6を使用して、次のようなオブジェクトを作成します。 const obj = { 2007: { x: width / 5, y: height / 2 }, 2008: { x: (2 / 5) * width, y: height / 2 }, 2009: { x: (3 / 5) * width, y: height / 2 …

3
ECMAScript 2015:forループの定数
以下の2つの(またはどちらでもない/両方の)コードフラグメントのどちらが、完全なECMAScript2015実装で機能する必要がありますか。 for (const e of a) for (const i = 0; i < a.length; i += 1) 私の理解では、最初の例はe反復ごとに初期化されるため、機能するはずです。これiは、2番目のバージョンにも当てはまるはずではありませんか? 既存の実装(Babel、IE、Firefox、Chrome、ESLint)は一貫性がなくconst、2つのループバリアントのさまざまな動作を伴う、の完全な実装を持っているように見えるため、私は混乱しています。また、基準の具体的なポイントがわからないので、よろしくお願いします。


3
ES6 + javascriptモジュールのエクスポートオプション
ES6モジュールのパブリックエクスポートが次の両方の方法で行われるのを見てきました。 // method 1 export var getAnswer = function () { return 'forty two'; }; // method 2 export default function () { return 'forty two'; }; これらは両方とも有効ですか? もしそうなら、なぜそれらは両方とも存在するのですか? ES6構文を使用したモジュールエクスポートに有効なオプションは他にありますか? googlefuで答えが見つからなかったのには驚きました。CommonJS、RequireJS、AMD、Nodeなどではなく、ES6モジュールのみに関心があります。

3
ES6-クラス内で静的メソッドを呼び出す
静的メソッドの内部呼び出しを行う次のクラスがあります。 export class GeneralHelper extends BaseHelper{ static is(env){ return config.get('env:name') === env; } static isProd(){ return GeneralHelper.is('prod'); } } 以下の行のクラス名を置き換えるために使用できるキーワードはありますか? GeneralHelper.is('prod'); PHPにはself、staticなどがあります。ES6はこれらに類似したものを提供しますか? TY。

6
ジェネレーターによるasync / awaitとES6のyieldの違い
この素晴らしい記事«ジェネレーター»を読んでいたところ、ジェネレーター関数を処理するためのヘルパー関数であるこの関数が明確に強調されています。 function async(makeGenerator){ return function () { var generator = makeGenerator.apply(this, arguments); function handle(result){ // result => { done: [Boolean], value: [Object] } if (result.done) return Promise.resolve(result.value); return Promise.resolve(result.value).then(function (res){ return handle(generator.next(res)); }, function (err){ return handle(generator.throw(err)); }); } try { return handle(generator.next()); } catch (ex) { return Promise.reject(ex); } …

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.