概要
this の値と、個々にあたえた引数をわたして、関数を呼び出します。
apply() メソッドに似ていますが、呼び出し先関数に渡す引数の指定方法が異なります。 apply() メソッドは、呼び出し先関数に渡す引数のリストを単一の配列として受けとります。構文
fun.call(thisArg[, arg1[, arg2[, ...]]])
引数
thisArg- 呼び出し先関数
funの中でthisパラメータとして使用される値です。 実際にこの値が関数の中でthisの値として使用されるとは限りません: もし、関数が non-strict mode のコードで、nullかundefinedが指定された場合はthisの値は global object になります。 また、プリミティブ値はボクシングされます。
arg1, arg2, ...- 呼び出し先関数
funに渡される引数です。
戻り値
this 値と引数を指定して関数を呼び出した結果です。
説明
呼び出し先関数の中で this として使われるオブジェクトを指定して関数を呼び出します。
this が何を指すかは、通常、関数の呼び出し形式によって決まります。 例えば obj.testMethod() というメソッド呼び出しの形式で関数を呼び出した場合、この関数の中の this はオブジェクト obj を指します。 あるオブジェクトに属するメソッドを別のオブジェクトのメソッドのように呼び出したい (すなわち、メソッド中の this キーワードの参照先オブジェクトを別のオブジェクトにしたい) とき、call メソッドを使えば、わざわざ別のオブジェクトのプロパティにそのメソッドを代入せずとも済みます。 例えば、obj.testMethod というメソッドを otherObj のメソッドのように呼び出したいときは、obj.testMethod.call( otherObj ) とすればよいです。
例
コンストラクタを連鎖させるために call メソッドを使用する
コンストラクタを用いてオブジェクトを生成する際に、call を用いることで Java のようにコンストラクタによる初期化を連鎖させることができます。 下の例では、Product コンストラクタは 2 つの引数 name と value をとるように定義されています。 Food と Toy は、call メソッドを使用して Product 内での this の値が自身の中での this の値と同じになるように Product コンストラクタを呼び出しています。 その際、引数として name と value を渡しています。 Product は name プロパティと price プロパティを初期化し、特殊化されたコンストラクタである Food と Toy はどちらも category プロパティを初期化します。
function Product(name, price) {
this.name = name;
this.price = price;
if (price < 0)
throw RangeError('Cannot create product "' + name + '" with a negative price');
return this;
}
function Food(name, price) {
Product.call(this, name, price);
this.category = 'food';
}
Food.prototype = new Product();
function Toy(name, price) {
Product.call(this, name, price);
this.category = 'toy';
}
Toy.prototype = new Product();
var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);
無名関数の呼び出しに call メソッドを使用する
次の例では、無名関数に対して call メソッドを呼び出すことで、この無名関数があたかも配列中のそれぞれのオブジェクトのメソッドであるかのように振舞わせています。 ここで無名関数を使用する主な目的は、無名関数の中でさらに関数オブジェクト (すなわちクロージャ) を生成し、その関数オブジェクトが配列中の正しいインデックス番号を保持するようにすることです。 無名関数の中で生成された関数オブジェクトは、配列中のオブジェクトのメソッドになります。 ここで call メソッドを使用する必要は実際にはありませんが、例を示す目的で使用しています。
var animals = [
{species: 'Lion', name: 'King'},
{species: 'Whale', name: 'Fail'}
];
for (var i = 0; i < animals.length; i++) {
(function (i) {
this.print = function () {
console.log('#' + i + ' ' + this.species + ': ' + this.name);
}
}).call(animals[i], i);
}
関数の呼び出しや'this'を明確にするためにcallメソッドを使用する
次の例では、greedメソッドを呼ぶとき、thisの値をオブジェクトiにバインドしています。
function greet() {
var reply = [this.person, 'Is An Awesome', this.role].join(' ');
console.log(reply);
}
var i = {
person: 'Douglas Crockford', role: 'Javascript Developer'
};
greet.call(i); // Douglas Crockford Is An Awesome Javascript Developer
仕様
| 仕様書 | ステータス | コメント |
|---|---|---|
| ECMAScript 1st Edition (ECMA-262) | 標準 | 初期定義. JavaScript 1.3にて作成. |
| ECMAScript 5.1 (ECMA-262) Function.prototype.call の定義 |
標準 | |
| ECMAScript 2015 (6th Edition, ECMA-262) Function.prototype.call の定義 |
標準 | |
| ECMAScript 2017 Draft (ECMA-262) Function.prototype.call の定義 |
ドラフト |