関数がオブジェクトであることについて

JavaScript では関数もオブジェクトのひとつです。ここでは関数とオブジェクトの関係について簡単にご紹介します。

(Last modified: 2023年02月03日)

関数とオブジェクトの関係

JavaScript では関数もオブジェクトのひとつです。関数宣言を使って関数を定義すると、関数名に指定した名前の変数が作成され、変数には関数オブジェクトが代入されます。

次のサンプルをみてください。

function calcTotal(x, y){
  return x + y;
}

関数 calcTotal を定義しています。関数が定義されると関数名に指定した calcTotal という変数が作成され、変数に関数オブジェクトが代入されます。その為、変数の値を参照すると関数オブジェクトが表示されます。

function calcTotal(x, y){
  return x + y;
}

console.log(calcTotal);
>> function calcTotal(x, y){
>>   return x + y;
>> }

関数オブジェクトが代入された変数を別の変数に代入することもできます。二つの変数は同じ関数オブジェクトを参照することになり、どちらの変数を使っても関数を呼びだすことができます。

function calcTotal(x, y){
  return x + y;
}

let myFunc = calcTotal;

console.log(myFunc(10, 8));
>> 18

また通常はこのようなことはしませんが、関数名に対して別の値を代入することもできます。

function calcTotal(x, y){
  return x + y;
}

calcTotal = 'Hello';

console.log(calcTotal);
>> Hello

このように JavaScript では関数を他のオブジェクトと同じように変数に代入したり、関数を別の関数を呼び出す時の引数として指定することもできます。

-- --

なお、今回は関数の宣言を行って関数を定義した場合でご説明していましたが、関数を変数に代入したり他の関数を呼びだす時の引数として指定する場合には、関数リテラルを使って最初から関数を変数に代入する形で関数を定義する方法が使われます。

let calcTotal = function(x, y){
  return x + y;
}

console.log(calcTotal(10, 8));
>> 18

console.log(calcTotal);
>> function (x, y){
>>   return x + y;
>> }

関数リテラルを使って関数を定義する場合、関数自体には名前がないため無名関数や匿名関数と呼ばれます。詳しい使い方は「関数リテラルを使って関数を定義する(無名関数)」をご参照ください。

-- --

JavaScript における関数とオブジェクトの関係について簡単にご紹介しました。

著者 / TATSUO IKURA

プログラミングや開発環境構築の解説サイトを運営しています。