JavaScript/Function/prototype/apply

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

Function.prototype.apply() は、関数を呼び出す際に this の値を指定し、引数を配列として渡すメソッドです。このメソッドは、関数の実行コンテキストを動的に変更するために使用されます[1]

構文

func.apply(thisArg, [argsArray])
  • func: 呼び出す対象の関数。
  • thisArg: 関数内で this として参照される値。非厳格モードでは nullundefined を渡すと this はグローバルオブジェクト(ブラウザでは window)に置き換えられます。
  • argsArray: 関数に渡す引数の配列(または配列風オブジェクト)。省略可能で、省略すると引数なしで関数が呼び出されます。

関数を呼び出し、this を指定するプログラム

以下のプログラムは、Function.prototype.apply() を使用して関数を呼び出し、this の値を指定します。

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

const anotherPerson = {
  name: 'Bob'
};

person.greet.apply(anotherPerson, ['Hello']); // "Hello, Bob!"

このプログラムでは、person オブジェクトの greet メソッドを呼び出していますが、this の値を anotherPerson に設定しています。これにより、greet メソッド内の this.nameBob を参照します。

配列を引数として関数を呼び出すプログラム

以下のプログラムは、Function.prototype.apply() を使用して配列を引数として関数を呼び出します。

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

const numbers = [1, 2, 3];

console.log(sum.apply(null, numbers)); // 6

このプログラムでは、sum 関数に配列 numbers を引数として渡しています。apply() を使用することで、配列の要素が個々の引数として関数に渡されます。

注意点

  • thisArg の挙動: thisArgnullundefined の場合、非厳格モードでは this はグローバルオブジェクト(ブラウザでは window)に置き換えられます。厳格モードでは nullundefined がそのまま this として使用されます。
  • 引数の配列: argsArray は配列または配列風オブジェクト(例えば arguments オブジェクト)である必要があります。配列風オブジェクトでない場合、TypeError が発生します。
  • 引数の数: apply() は、関数に渡す引数の数を動的に変更することができます。これにより、可変長引数を扱う関数を柔軟に呼び出すことができます。
  • パフォーマンス: 現代の JavaScript では、apply() の代わりにスプレッド演算子(...)を使用することが推奨される場合があります。スプレッド演算子はより簡潔でパフォーマンスが良い場合があります。

脚註

  1. これは、関数の this 値を制御し、引数を配列として渡すために使用されます。

外部リンク

カテゴリ:Book:JavaScript#Function/prototype/apply%20 カテゴリ:JavaScript
カテゴリ:Book:JavaScript カテゴリ:JavaScript カテゴリ:Pages using the JsonConfig extension