JavaScriptの無名関数とは？基本から使い方まで徹底解説

JavaScriptにおける無名関数（匿名関数）は、関数名を持たない関数のことです。イベント処理やコールバック関数など、実務でも頻繁に使用される重要な概念です。

本記事では、無名関数の基本から具体的な使い方、注意点までを体系的に解説します。基礎を確実に理解することで、より実践的なコードが書けるようになります。

無名関数とは

無名関数の定義

無名関数とは、名前（関数名）を持たない関数のことです。

通常の関数は以下のように名前を持ちます。

// function.js
function greet() {
  console.log("こんにちは");
}

greet();

一方、無名関数は次のように定義されます。

// anonymous-function.js
const greet = function () {
  console.log("こんにちは");
};

greet();

このように、関数を変数に代入することで、関数名を省略できます。

無名関数が使われる理由

無名関数は主に以下の場面で使用されます。

• 一度しか使わない処理
• コールバック関数として渡す場合
• イベント処理

コードの可読性や簡潔さを保つために重要な役割を持っています。

無名関数の基本的な使い方

変数に代入して使う

最も基本的な使い方は、変数に代入する方法です。

// assign-anonymous-function.js
const add = function (a, b) {
  return a + b;
};

console.log(add(2, 3)); // 5

この形式は「関数式」とも呼ばれます。

引数として渡す（コールバック関数）

無名関数は、他の関数の引数として渡すことができます。

// callback-anonymous-function.js
const numbers = [1, 2, 3, 4, 5];

numbers.forEach(function (num) {
  console.log(num);
});

このような使い方はコールバック関数と呼ばれます。

コールバック関数については、以下の記事で詳しく解説しています。

👉 JavaScriptのコールバック関数とは？基本から解説

即時実行関数（IIFE）

無名関数は、その場で実行することもできます。

// iife.js
(function () {
  console.log("即時実行されました");
})();

このような形式を「即時実行関数（IIFE）」と呼びます。

無名関数とアロー関数の違い

無名関数は、アロー関数と混同されがちです。

// arrow-function.js
const greet = () => {
  console.log("こんにちは");
};

greet();

アロー関数も無名関数の一種ですが、以下の違いがあります。

• thisの扱いが異なる
• 書き方が簡潔
• argumentsが使えない

アロー関数については、以下の記事で詳しく解説しています。

👉 JavaScriptのアロー関数とは？基本から解説

無名関数を使うメリット

コードがシンプルになる

一度しか使わない関数に名前をつける必要がなくなり、コードがすっきりします。

スコープを限定できる

無名関数を使うことで、処理を限定された範囲に閉じ込めることができます。

// scope-anonymous-function.js
(function () {
  const message = "外からアクセスできない";
  console.log(message);
})();

柔軟な処理が可能になる

コールバックとして渡すことで、動的な処理が可能になります。

無名関数の注意点

再利用には向かない

無名関数は名前を持たないため、再利用する場合には不向きです。

複数箇所で使う処理は、通常の関数として定義する方が適しています。

デバッグがしにくい

エラー発生時に関数名が表示されないため、問題の特定が難しくなることがあります。

無名関数がよく使われる場面

イベント処理

// event-anonymous-function.js
document.addEventListener("click", function () {
  console.log("クリックされました");
});

非同期処理

// async-anonymous-function.js
setTimeout(function () {
  console.log("1秒後に実行");
}, 1000);

非同期処理については、以下の記事で理解を深めることが重要です。

👉 JavaScriptの非同期処理とは？Promiseとasync/awaitの基礎

無名関数と通常の関数の使い分け

無名関数と通常の関数は、用途に応じて使い分けることが重要です。

このように使い分けることで、可読性と保守性が向上します。

まとめ

無名関数は、JavaScriptにおいて非常に重要な概念です。

• 関数名を持たない関数
• コールバックやイベント処理で多用される
• コードをシンプルにできる
• 再利用には不向き

基礎を理解することで、より柔軟で実践的なコードが書けるようになります。

関連記事

• JavaScriptの関数とは？基本から解説
• JavaScriptのコールバック関数とは？基本から解説
• JavaScriptのアロー関数とは？基本から解説
• JavaScriptの非同期処理とは？Promiseとasync/awaitの基礎