JavaScriptのIIFE (即時関数、即時実行関数式)の使い方と具体例

2021年2月7日JavaScript

JavaScriptのIIFE (即時関数、即時実行関数式)の使い方と具体例を紹介します。

JavaScriptのIIFE (即時実行関数式)の使い方と具体例

即時実行関数式は、(IIFE,immediately invoked Funtion Expressions)や即時関数とも呼ばれます。
即時実行関数式は、関数定義と同時に一度だけ実行される関数のことです。
実行結果が呼び出し元に返却されます。

const IIFE = (
  function (仮引数) {
    return 戻り値;
  }
)(実引数);

一回だけ使いたいという関数が必要になる場合に使います。

//IIFEではない普通の関数
const runOnce = function() {
  console.log('この書き方では実際は何回も呼び出せる');
}
runOnce();//この書き方では実際は何回も呼び出せる
runOnce();//この書き方では実際は何回も呼び出せる
runOnce();//この書き方では実際は何回も呼び出せる

下のように()でfunctionを囲うことで式(expression)になり、式の末尾に()という実行を意味する記述をすることで、本当に一回だけしか使えません。

//IIFE (即時実行関数式)
(function() {
  console.log('この書き方だと一回しか呼び出せない');
})();//この書き方だと一回しか呼び出せない

//アロー関数のIIFE (即時実行関数式)
(() => console.log('アロー関数のIIFE'))();//アロー関数のIIFE

これを、IIFE (即時実行関数式:Immediately Invoked Function Expression)といいます。英語の発音としてはそのまま読むか、イフィーという人もいます。