Skip to main content
本文に 650 文字追加
ソース リンク
pgrho
  • 1.4万
  • 1
  • 15
  • 31

=>アロー関数と呼ばれるECMAScript 6で導入された構文で、「引数のないthisを返す無名関数」を作成しています。

前半の()は関数の仮引数宣言です。この場合は()ですので引数を取りませんが、一般的に(a, b, c, ..., z)のように宣言します。また引数がないこと1個の場合a =>のように括弧表し省略することが出来ます。

従来のJavaScript後半this関数オブジェクトの本体{ return this; }の省略形です。

またアロー関数に呼び出し方によりアロー関数が作成されたときのthisの値がアロー関数内部で使用されるthisの値になる」という特徴があります。

仮に質問文のコードをfunctionを使って

baz(function () { return this });

と書き換えると、baz内での引数の取り扱いによって関数内のthisの値が変化するためしてしまいます。

function baz(fn) {
    console.log(fn()); // グローバルオブジェクトが出力される

    var obj = { fn: fn };
    console.log(obj.fn()); // objが出力される
}

これではなにかと不都合なので、呼び出し側でthis参照を変数に置き換えたり

var _this = this;
baz(function () { return _this; });

のよう関数呼び出し元で渡す引数にthisとなる値をどこかに保存するか、引数として追加で含めてthisFunction.prototype.callとして使用する値apply指定させる必要呼び出して実行するなどの方法ありとられていましたが、アロー

baz(this.foo, this);

// function baz(fn, thisArg)
fn.call(thisArg);

アロー関数では関数内のthisはアロー関数式変化しない実行されたときでこのような工夫thisに束縛されるため、簡潔に匿名関数する必要定義して他の処理に渡すことありません出来ます

=>アロー関数と呼ばれるECMAScript 6で導入された構文です。()は引数がないこと表します。

従来のJavaScriptの関数オブジェクトでは呼び出し方により関数内のthisの値が変化するため

var _this = this;
baz(function(){ return _this; });

のよう呼び出し元でthis値をどこかに保存するか、引数として追加でthisとして使用する値指定させる必要ありましたが、アロー関数ではthis変化しないでこのような工夫する必要ありません

アロー関数と呼ばれるECMAScript 6で導入された構文で、「引数のないthisを返す無名関数」を作成しています。

前半の()は関数の仮引数宣言です。この場合は()ですので引数を取りませんが、一般的に(a, b, c, ..., z)のように宣言します。また引数が1個の場合a =>のように括弧省略することが出来ます。

後半this関数の本体{ return this; }の省略形です。

またアロー関数にアロー関数が作成されたときのthisの値がアロー関数内部で使用されるthisの値になる」という特徴があります。

仮に質問文のコードをfunctionを使って

baz(function () { return this });

と書き換えると、baz内での引数の取り扱いによって関数内のthisの値が変化してしまいます。

function baz(fn) {
    console.log(fn()); // グローバルオブジェクトが出力される

    var obj = { fn: fn };
    console.log(obj.fn()); // objが出力される
}

これではなにかと不都合なので、呼び出し側でthis参照を変数に置き換えたり

var _this = this;
baz(function () { return _this; });

関数渡す引数にthisとなる値を含めてFunction.prototype.callapply呼び出して実行するなどの方法とられていました

baz(this.foo, this);

// function baz(fn, thisArg)
fn.call(thisArg);

アロー関数では関数内のthisはアロー関数式実行されたときthisに束縛されるため、簡潔に匿名関数定義して他の処理に渡すこと出来ます

ソース リンク
pgrho
  • 1.4万
  • 1
  • 15
  • 31

=>アロー関数と呼ばれるECMAScript 6で導入された構文です。()は引数がないことを表します。

従来のJavaScriptの関数オブジェクトでは呼び出し方により関数内のthisの値が変化するため、

var _this = this;
baz(function(){ return _this; });

のように呼び出し元でthisの値をどこかに保存するか、引数として追加でthisとして使用する値を指定させる必要がありましたが、アロー関数ではthisが変化しないのでこのような工夫をする必要がありません。