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

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

9
Reactコンポーネントにコンポーネントのデフォルトの小道具を設定する方法
以下のコードを使用して、Reactコンポーネントにデフォルトの小道具を設定しますが、機能しません。このrender()メソッドでは、「未定義の小道具」という出力がブラウザコンソールに出力されたことがわかります。コンポーネントの小道具のデフォルト値を定義するにはどうすればよいですか？ export default class AddAddressComponent extends Component { render() { let {provinceList,cityList} = this.props if(cityList === undefined || provinceList === undefined){ console.log('undefined props') } ... } AddAddressComponent.contextTypes = { router: React.PropTypes.object.isRequired } AddAddressComponent.defaultProps = { cityList: [], provinceList: [], } AddAddressComponent.propTypes = { userInfo: React.PropTypes.object, cityList: PropTypes.array.isRequired, provinceList: PropTypes.array.isRequired, }
19
ES6クラスの多重継承
私はこれについてほとんどの研究をBabelJSとMDN（まったく情報がありません）で行いましたが、ES6仕様の詳細を調べるのに十分注意していない場合は、遠慮なく教えてください。 ES6が他のアヒル型の言語と同じ方法で多重継承をサポートするかどうか疑問に思っています。たとえば、次のようなことができますか？ class Example extends ClassOne, ClassTwo { constructor() { } } 複数のクラスを新しいクラスに拡張するには？その場合、インタプリタはClassOneよりClassTwoのメソッド/プロパティを優先しますか？
9
「this」をアロー関数にバインドできますか？
ES6をしばらく試してみましたが、ちょっとした問題が発生しました。 私はアロー関数を使うのが本当に好きで、できる限りそれを使います。 ただし、バインドできないようです。 これが関数です： var f = () => console.log(this); これは、関数をバインドするオブジェクトです。 var o = {'a': 42}; そして、ここで私が結合する方法ですfにo： var fBound = f.bind(o); そして、私はただ電話することができますfBound： fBound(); これを出力します（oオブジェクト）： {'a': 42} 涼しい！美しい！それが機能しないことを除いて。oオブジェクトを出力する代わりに、オブジェクトを出力しwindowます。 だから私は知りたいです：あなたは矢印関数をバインドできますか？（もしそうなら、どうですか？） 上記のコードをGoogle Chrome 48とFirefox 43でテストしましたが、結果は同じです。
14
ES6構文とBabelを使用したJavascriptのエラーの拡張
ES6とBabelでエラーを拡張しようとしています。うまくいっていません。 class MyError extends Error { constructor(m) { super(m); } } var error = new Error("ll"); var myerror = new MyError("ll"); console.log(error.message) //shows up correctly console.log(myerror.message) //shows empty string Errorオブジェクトが正しいメッセージセットを取得することはありません。 Babel REPLで試してください。 今、私はSOでいくつかのソリューションを見ました（たとえば、ここ）が、それらはすべて非常に非ES6-yのようです。それをES6の素敵な方法で行うには？（それはバベルで働いています）
6
componentDidUpdate（）内のsetState（）
ドロップダウンの高さと画面上の入力の位置に応じて、ドロップダウンを入力の下または上に移動するスクリプトを書いています。また、修飾子をその方向に応じてドロップダウンに設定したいと思います。しかし、setState内部で使用componentDidUpdateすると無限ループが発生します（これは明らかです） getDOMNodeclassnameを直接使用してドロップダウンに設定することで解決策を見つけましたが、Reactツールを使用するより良い解決策があるはずです。誰かが私を助けてくれますか？ 以下は、機能するコードの一部ですgetDOMNode（コードを簡略化するためにポジショニングロジックを少し無視しています）。 let SearchDropdown = React.createClass({ componentDidUpdate(params) { let el = this.getDOMNode(); el.classList.remove('dropDown-top'); if(needToMoveOnTop(el)) { el.top = newTopValue; el.right = newRightValue; el.classList.add('dropDown-top'); } }, render() { let dataFeed = this.props.dataFeed; return ( <DropDown > {dataFeed.map((data, i) => { return (<DropDownRow key={response.symbol} data={data}/>); })} </DropDown> ); } }); そしてこれがsetstateを含むコードです（これは無限ループを作成します） let …
3
JavaScriptでセットをマップ/縮小/フィルターする方法は？
JavaScriptでmap/ reduce/ filter/ etcを作成する方法はありSetますか、それとも自分で作成する必要がありますか？ ここにいくつかの賢明なSet.prototype拡張機能があります Set.prototype.map = function map(f) { var newSet = new Set(); for (var v of this.values()) newSet.add(f(v)); return newSet; }; Set.prototype.reduce = function(f,initial) { var result = initial; for (var v of this) result = f(result, v); return result; }; Set.prototype.filter = function filter(f) { var …
30
Reactプロジェクトで「クラスを関数として呼び出せません」を取得する
Reactマップコンポーネントをプロジェクトに追加しようとしていますが、エラーが発生します。Fullstack Reactのブログ投稿を参考にしています。エラーがスローされる場所をgoogle_map.jsの83行目で追跡しました。 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } これが私の地図コンポーネントです。最後の3行である58〜60行目をコメントアウトすると、ページは（マップなしで）正常にロードされます。編集：@Dmitriy Nevzorovが提案した変更を加えましたが、それでも同じエラーが発生します。 import React from 'react' import GoogleApiComponent from 'google-map-react' export class LocationsContainer extends React.Component { constructor() { super() } render() { const style = { width: '100vw', …
18
ES6テンプレートリテラルを実行時に置換（または再利用）できますか？
tl; dr：再利用可能なテンプレートをリテラルにすることは可能ですか？ 私はテンプレートリテラルを使用しようとしましたが、私はそれを取得できなかったと思いますが、今はイライラしています。つまり、私はそれを理解していると思いますが、「それ」は、それがどのように機能するか、またはそれがどのように機能するかではありません。別の方法で取得する必要があります。 私が見たすべての例（タグ付きテンプレートを含む）では、「置換」は実行時ではなく宣言時に行う必要があります。これは、私にとってテンプレートにはまったく役に立たないようです。多分私は狂っていますが、私にとっての「テンプレート」は、作成時にではなく、使用時に置換されるトークンを含むドキュメントです。それ以外の場合、それは単なるドキュメント（文字列）です。テンプレートはトークンとともにトークンとして保存され、それらのトークンは評価時に評価されます。 誰もが次のような恐ろしい例を挙げています： var a = 'asd'; return `Worthless ${a}!` それはいいですが、もし私がすでに知っているならa、私はただreturn 'Worthless asd'かしreturn 'Worthless '+aます。ポイントは何ですか？真剣に。さて、ポイントは怠惰です。プラスが少なく、読みやすくなります。すごい。しかし、それはテンプレートではありません！私見ではない。そして重要なのはMHOだけです。問題は、私見ですが、テンプレートが宣言されたときに評価されるということです。 var tpl = `My ${expletive} template`; function go() { return tpl; } go(); // SPACE-TIME ENDS! expletiveは宣言されていないため、のようなものが出力されますMy undefined template。素晴らしい。実際、少なくともChromeでは、テンプレートを宣言することすらできません。expletive定義されていないため、エラーがスローされます。テンプレートを宣言した後で置換を実行できるようにする必要があります。 var tpl = `My ${expletive} template`; function go() { return tpl; } var expletive …
17
ES6構文を使用してjqueryをインポートする方法
私はトランスパイラーとプラグインES6を介して（JavaScript）構文を使用して、またスタイルのために新しいアプリを書いてbabelいpreset-es2015ますsemantic-ui。 index.js import * as stylesheet from '../assets/styles/app.scss'; import * as jquery2 from '../dist/scripts/jquery.min'; import * as jquery3 from '../node_modules/jquery/dist/jquery.min'; console.log($('my-app')); index.html <!DOCTYPE html> <html lang="fr"> <head> <body> <script src="dist/app.js"></script> </body> </html> プロジェクトの構造 . ├── app/ │ ├── index.js ├── assets/ ├── dist/ │ ├── scripts/ │ │ ├── jquery.min.js …
8
プレーンオブジェクトをES6マップに変換する方法は？
どういうわけか、MDNのドキュメントでこの単純なものを見つけることができません（たぶん私はそれを逃しているだけです）。 私はこれがうまくいくと思っていました： const map = new Map({foo: 'bar'}); map.get('foo'); // 'bar' ...しかし、最初の行がスローされます TypeError: (var)[Symbol.iterator] is not a function プレーンオブジェクトからマップを作成するにはどうすればよいですか？本当に最初にそれをキーと値のペアの配列の配列に変換する必要がありますか？
5
Typescript es6インポートモジュール「ファイルはモジュールエラーではありません」
私はes6モジュール構文でtypescript 1.6を使用しています。 私のファイルは： test.ts： module App { export class SomeClass { getName(): string { return 'name'; } } } main.ts： import App from './test'; var a = new App.SomeClass(); main.tsファイルをコンパイルしようとすると、次のエラーが発生します。 エラーTS2306：ファイル 'test.ts'はモジュールではありません。 どうすればそれを達成できますか？
5
ES6の矢印関数でjQuery $（this）を使用する（字句thisバインディング）
字句thisバインディングでES6矢印関数を使用するのは素晴らしいことです。 しかし、典型的なjQueryクリックバインディングで使用する前に問題が発生しました。 class Game { foo() { self = this; this._pads.on('click', function() { if (self.go) { $(this).addClass('active'); } }); } } 代わりに矢印関数を使用します。 class Game { foo() { this._pads.on('click', () => { if (this.go) { $(this).addClass('active'); } }); } } そして$(this)ES5（self = this）型クロージャに変換されます。 Traceurに字句バインディングの「$（this）」を無視させる方法はありますか？
7
HomeにはHomeという名前のエクスポートが含まれていません
私は作業していてcreate-react-app、この問題に遭遇しましたHome does not contain an export named Home。 App.jsファイルの設定方法は次のとおりです。 import React, { Component } from 'react'; import logo from './logo.svg'; import './App.css'; import { Home } from './layouts/Home' class App extends Component { render() { return ( <div className="App"> Hello <Home /> </div> ) } } export default App; 今私のlayoutsフォルダにはHome.jsファイルがあります。以下のように設定します。 …
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.