[解決済み] "=>"の意味は?(JavaScriptでは、等号と大文字からなる矢印を使用することができますか?
質問
は知っています。
>=
演算子は more than or equal to を意味しますが、私はこれまで
=>
を、いくつかのソースコードで見ることができます。この演算子はどういう意味なのでしょうか?
これがそのコードです。
promiseTargetFile(fpParams, aSkipPrompt, relatedURI).then(aDialogAccepted => {
if (!aDialogAccepted)
return;
saveAsType = fpParams.saveAsType;
file = fpParams.file;
continueSave();
}).then(null, Components.utils.reportError);
解決方法は?
内容
矢印機能です。
アロー関数は、ECMAscript 6 で導入された短い構文で、関数式と同じように使用することができます。つまり、次のような式の代わりによく使うことができます。
function (foo) {...}
. しかし、これらにはいくつかの重要な違いがあります。例えば、これらは自分自身の値である
this
(を使用します(議論は後述)。
アロー関数は、ECMAscript 6 の仕様の一部です。これらはまだすべてのブラウザでサポートされているわけではありませんが、部分的または完全にサポートされています。 Node v. 4.0+ では と、2018年現在使用されているほとんどのモダンブラウザで使用されています。(以下に対応ブラウザの一部を掲載しました)。
で詳しく紹介しています。 Mozillaのドキュメント 矢印関数について .
Mozillaのドキュメントより。
アロー関数式(ファットアロー関数とも呼ばれる)は、次のような短い構文を持っています。 関数式 を辞書的に結合し
this
の値をバインドしない(自分自身のthis
,arguments
,super
またはnew.target
). アロー関数は常に無名です。これらの関数式は非メソッド関数に最適で、コンストラクタとして使用することはできません。
方法についての注意点
this
アローファンクションでの動作
アロー関数の最も便利な機能の1つが、上のテキストに埋もれています。
アロー関数とは...辞書的に
this
の値をバインドしない(自分自身のthis
...)
これは簡単に言うと、arrow 関数が
this
の値は、そのコンテキストから取得し、独自の
this
. 従来の関数
かもしれません
は、自身の
this
の値は、その定義と呼び出し方によって異なります。このため、次のような多くの工夫が必要になることがあります。
self = this;
などにアクセスし、操作することができます。
this
を、ある関数から別の関数の内部で使用することができます。このトピックの詳細については、以下を参照してください。
の説明と例は、Mozilla ドキュメント
.
コード例
例(同じくdocsより)。
var a = [
"We're up all night 'til the sun",
"We're up all night to get some",
"We're up all night for good fun",
"We're up all night to get lucky"
];
// These two assignments are equivalent:
// Old-school:
var a2 = a.map(function(s){ return s.length });
// ECMAscript 6 using arrow functions
var a3 = a.map( s => s.length );
// both a2 and a3 will be equal to [31, 30, 31, 31]
互換性についての注意事項
Nodeで矢印関数を使用することができますが、ブラウザのサポートは不安定です。
この機能に対するブラウザのサポートはかなり改善されましたが、ほとんどのブラウザベースの使用法ではまだ十分な普及率ではありません。2017年12月12日現在、現在のバージョンでサポートされています。
- クローム (v. 45+)
- Firefox (v. 22+)
- エッジ (v. 12+)
- オペラ (v. 32+)
- アンドロイドブラウザ(v.47+)
- オペラモバイル (v. 33+)
- Android版Chrome (v. 47+)
- Android版Firefox (v. 44+)
- サファリ (v. 10+)
- iOS版サファリ(v.10.2以上)
- サムスンインターネット (v. 5+)
- Baiduブラウザ(v.7.12以上)
には対応していません。
- IE (v.11まで)
- オペラミニ(v.8.0まで)
- ブラックベリーブラウザ(v.10まで)
- IEモバイル(v.11まで)
- UC Browser for Android (v.11.4まで)
- QQ (v.1.2まで)
より多くの(そして最新の)情報は、以下のサイトでご覧いただけます。 CanIUse.com (提携はしていません)。
関連
-
JavaScriptの関数この指摘の問題を説明
-
vueのグローバルがscss(mixin)を導入。
-
JSクリックイベント - Uncaught TypeError: プロパティ 'onclick' に null を設定できません。
-
[解決済み] JavaScriptでメールアドレスを検証するのに最適な方法は何ですか?
-
[解決済み] なぜGoogleはJSONレスポンスにwhile(1);を前置するのでしょうか?
-
[解決済み] 私のJavaScriptコードは "No 'Access-Control-Allow-Origin' header is present on requested resource "というエラーを受け取りますが、Postmanはそうならないのはなぜですか?
-
[解決済み] JavaScriptの配列で一意な値をすべて取得する(重複を排除する)。
-
[解決済み] Node.jsを使うタイミングをどう判断するか?
-
[解決済み] ngModel' は 'input' の既知のプロパティではないため、バインドできません。
-
[解決済み] javascript:void(0)」とは何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vueはランニングライト形式のテキストを水平方向にスクロールする機能を実装している
-
vueにおけるfilterの適用シーンについて解説します。
-
vueのプロジェクトでモックを使用する方法を知っていますか?
-
Vueのフォームイベントのデータバインディングの説明
-
[解決済み】SyntaxError: JSONの位置1に予期しないトークンoがある。
-
[解決済み】ローカルファイルを開くことができません - Chrome: ローカルリソースの読み込みが許可されていない
-
[解決済み】JavaScriptの配列でforEachが関数でない不具合
-
[解決済み】"フォームが接続されていないため、フォームの送信がキャンセルされました "というエラーの取得について
-
[解決済み】 env: node: macにそのようなファイルやディレクトリはありません
-
Uncaught TypeError: null のプロパティ 'offsetHeight' を読み取れませんでした。