Wikimore

カテゴリ:Book:JavaScript#Function/prototype/bind%20

Function.prototype.bind() は、指定された this 値と引数を事前に設定した新しい関数を生成するメソッドです。このメソッドは、関数の実行コンテキストを固定し、部分的に引数を適用するために使用されます^[1]。

構文

func.bind(thisArg[, arg1[, arg2[, ...]]])

func: バインドする対象の関数。
thisArg: 新しい関数内で this として参照される値。
arg1, arg2, ...: 新しい関数に事前に適用する引数（省略可能）。

例

this を固定した関数を生成するプログラム

以下のプログラムは、Function.prototype.bind() を使用して this を固定した新しい関数を生成します。

const person = {
  name: 'Alice',
  greet: function(message) {
    console.log(`${message}, ${this.name}!`);
  }
};

const anotherPerson = {
  name: 'Bob'
};

const boundGreet = person.greet.bind(anotherPerson);
boundGreet('Hello'); // "Hello, Bob!"

このプログラムでは、person.greet メソッドの this を anotherPerson に固定した新しい関数 boundGreet を生成しています。これにより、boundGreet を呼び出すと、this.name は Bob を参照します。

引数を事前に適用した関数を生成するプログラム

以下のプログラムは、Function.prototype.bind() を使用して引数を事前に適用した新しい関数を生成します。

function sum(a, b, c) {
  return a + b + c;
}

const addFive = sum.bind(null, 2, 3);
console.log(addFive(5)); // 10

このプログラムでは、sum 関数の最初の2つの引数を 2 と 3 に固定した新しい関数 addFive を生成しています。これにより、addFive(5) を呼び出すと、2 + 3 + 5 が計算されます。

注意点

thisArg の挙動: thisArg が null や undefined の場合、非厳格モードでは this はグローバルオブジェクト（ブラウザでは window）に置き換えられます。厳格モードでは null や undefined がそのまま this として使用されます。
引数の部分適用: bind() は、関数の引数を部分的に適用することができます。これにより、カリー化や部分適用を実現することができます。
新しい関数の生成: bind() は、元の関数を変更せずに新しい関数を生成します。生成された関数は、this と引数が固定された状態で呼び出されます。
パフォーマンス: bind() は、新しい関数を生成するため、頻繁に使用するとメモリ使用量が増加する可能性があります。パフォーマンスが重要な場面では、他の方法（例えばアロー関数やクロージャ）を検討することが推奨されます。