web-dev-qa-db-ja.com

矢印関数をバインドできますか？

私はしばらくの間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でテストしましたが、結果は同じです。

javascriptfunctionecmascript-6
98
Florrie

矢印関数を「再バインド」することはできません。定義されたコンテキストで常に呼び出されます。通常の機能を使用してください。

ECMAScript 2015 Spec から：

ArrowFunction内の引数、super、this、またはnew.targetへの参照は、字句的に囲まれた環境のバインディングに解決する必要があります。通常、これは、すぐに囲む関数の関数環境になります。

117
Nick Tomlin

完了するには、矢印関数をcan再バインドします。thisの意味を変更することはできません。

bindにはまだ関数の引数の値があります：

((a, b, c) => {
  console.info(a, b, c) // 1, 2, 3
}).bind(undefined, 1, 2, 3)()

ここで試してください： http://jsbin.com/motihanopi/edit?js,console

33
cvazac

MDN から：

矢印関数式は、関数式と比較して構文が短く、this値を字句的にバインドします（独自のthis、arguments、super、またはnew.targetをバインドしません）。矢印関数は常に匿名です。

これは、希望どおりに値をバインドできないことを意味します。

11
Sterling Archer

ES6の矢印関数はJavaScriptで「これ」を本当に解決します

上記のリンクは、矢印関数thisがbind, call, apply関数で変更されないことを説明しています。

非常に良い例で説明されています。

これをnode v4で実行して、「予期される」動作を確認します。

this.test = "attached to the module";
var foo = { test: "attached to an object" };
foo.method = function(name, cb){ 
    // bind the value of "this" on the method 
    // to try and force it to be what you want 
    this[name] = cb.bind(this); };
foo.method("bar", () => { console.log(this.test); });
foo.bar();
4
Prithvi Raj Vuppalapati

数日前に同じ質問をしました。

thisはすでにバインドされているため、値をバインドできません。

このスコープをES6にバインド==関数演算子

3
fos.alex
var obj = {value: 10};
function arrowBind(fn, context) {
  let arrowFn;
  (function() {
    arrowFn = eval(fn.toString());
    arrowFn();
  }).call(context);
}
arrowBind(() => {console.log(this)}, obj);
3
theName

たぶんこの例はあなたに役立ちます：

let bob = {
   _name: "Bob",
   _friends: ["stackoverflow"],
   printFriends:(x)=> {
      x._friends.forEach((f)=> {
         console.log(x._name + " knows " + f);
      });
   }
}

bob.printFriends = (bob.printFriends).bind(null,bob);
bob.printFriends();
0
Ehsan