54

ES6 では、次の 2 つの関数はほとんど同じように思えます。

function () {
  return this;
}.bind(this);

() => {
  return this;
};

this最終結果は同じように見えます。アロー関数は、コンテキストが作成された場所と同じ値にバインドされた JavaScript 関数オブジェクトを生成しますthis。

明らかに、一般的な意味で、Function.prototype.bindはアロー関数よりも柔軟です。 local 以外の値にバインドでき、最初に作成されてから長い時間が経過する可能性がある任意の時点でthis任意の関数をバインドできます。thisただし、bindそれ自体がアロー関数とどのように異なるかを尋ねているのではなく、アロー関数が ですぐに呼び出すことbindとどのように異なるかを尋ねていthisます。

ES6 の 2 つの構造に違いはありますか?

4

3 に答える 3

32

いくつかの違いがあります:

  • アロー関数は構築できません。アロー関数とバインドされた関数の両方に.prototypeプロパティがありませんが、前者は with で呼び出されたときに例外をスローしますがnew、後者はバインドされた値を無視し、ターゲット関数をコンストラクターとして呼び出します (ただし、部分的に適用されたバインドされた引数を使用します)。新しいインスタンスで。

    function F() {}
var f = () => {},
    boundF = F.bind({});
console.log(new boundF(), new boundF instanceof F) // {}, true
console.log(new f) // TypeError

  • アロー関数には( lexical だけでなく) lexical も含まれargumentsます。アロー関数の呼び出しはそれらのいずれも初期化せず、アロー関数が定義された関数から継承されるだけです。バインドされた関数では、ターゲット関数のそれぞれの値を参照するだけです。new.targetsuperthis

  • アロー関数は実際にはthis値をバインドしません。むしろ、それらはそれを持っておらず、使用thisすると、字句スコープ内の変数名のように検索されます。thisこれにより、アロー関数がまだ利用可能になっていない間に、遅延してアロー関数を定義することができます:

    class X extends Object {
    constructor() {
         var f = () => this, // works
             boundF = function(){ return this; }.bind(this);
//                                                    ^^^^ ReferenceError
         super(); // initialises `this`
         console.log(f(), f() == this); // {}, true
    }
}
new X;

  • アロー関数をジェネレーター関数にすることはできません (ただし、ジェネレーターを返すことはできます)。ジェネレーター関数で使用できますが.bind()、アロー関数を使用してこれを表現する方法はありません。

于 2015-09-12T13:34:06.153 に答える