call() メソッドは、 this の値と、独立して提供された引数によって関数を呼び出します。

メモ: このメソッドの構文は apply() とほぼ同じですが、基本的な違いは call()引数リストを受け取るのに対して、 apply()引数の単一の配列を受け取る点です。

構文

function.call(thisArg, arg1, arg2, ...)

引数

thisArg
任意項目です。 function の呼び出して提供される this の値です。なお、実際にこの値が関数の中で this の値として使用されるとは限りません。もし、そのメソッドが非 strict モードの関数だった場合、 nullundefined はグローバルオブジェクトで置き換えられ、プリミティブ値はオブジェクトに変換されます。
arg1, arg2, ...
任意項目です。呼び出し先の関数に渡される引数です。

返値

this の値と引数を指定して関数を呼び出した結果です。

解説

call() はあるオブジェクトに所属する関数やメソッドを、別なオブジェクトに割り当てて呼び出すことができます。

call() は関数やメソッドに this の新しい値を提供します。 call によって、いったんメソッドを書いてから、新しいオブジェクトへメソッドを描き直さずに他のオブジェクトへと継承することができます。

オブジェクトのコンストラクターを連鎖させるための call メソッドの使用

call を使用して、 Java と同様にオブジェクトのコンストラクターを連鎖させることができます。下記の例では、 Product オブジェクトのコンストラクターは nameprice の二つの引数で定義されています。他の FoodToy の二つの関数は、 Product を呼び出して thisnameprice を渡します。 Productnameprice プロパティを初期化し、どちらも特化した関数が category を定義します。

function Product(name, price) {
  this.name = name;
  this.price = price;
}

function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}

function Toy(name, price) {
  Product.call(this, name, price);
  this.category = 'toy';
}

var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);

call メソッドを使用した無名関数の呼び出し

次の例では、無名関数を作成して call を使用して配列内の各オブジェクトに対して呼び出しを行います。ここでの無名関数の主な目的は、 print 関数をすべてのオブジェクトに追加することで、配列内のオブジェクトの正しいインデックスを表示できるようにします。実際には this の値としてオブジェクトを渡す必要ありませんが、例示の目的で使用しています。

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);
    }
    this.print();
  }).call(animals[i], i);
}

call を使用した関数を呼び出しと 'this' のコンテキストの指定

次の例では、greet メソッドを呼ぶとき、this の値を obj オブジェクトにバインドしています。

function greet() {
  var reply = [this.animal, 'typically sleep between', this.sleepDuration].join(' ');
  console.log(reply);
}

var obj = {
  animal: 'cats', sleepDuration: '12 and 16 hours'
};

greet.call(obj);  // cats typically sleep between 12 and 16 hours

call を使用した最初の引数を指定しない関数の呼び出し

下記の例では、 display 関数を、最初の引数を渡さずに呼び出しています。最初の引数が渡されないと、 this の値はグローバルオブジェクトに結び付けられます。

var sData = 'Wisen';

function display() {
  console.log('sData value is %s ', this.sData);
}

display.call();  // sData value is Wisen

メモ: strict モードでは this の値は undefined になります。以下を参照してください。

'use strict';

var sData = 'Wisen';

function display() {
  console.log('sData value is %s ', this.sData);
}

display.call(); // undefined の 'sData' のプロパティは読めない

仕様書

仕様書 状態 備考
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 Latest Draft (ECMA-262)
Function.prototype.call の定義
ドラフト  

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
callChrome 完全対応 ありEdge 完全対応 12Firefox 完全対応 1IE 完全対応 ありOpera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 ありnodejs 完全対応 あり

凡例

完全対応  
完全対応

関連情報

ドキュメントのタグと貢献者

最終更新者: mdnwebdocs-bot,