for

for 文は、括弧で囲みセミコロンで区切った3つの引数と、続いてループ内で実行される文 (ふつうはブロック文) から成るループを構成します。

構文

for ([initialization]; [condition]; [final-expression])
   statement
initialization
ループが始まる前に一度だけ評価される (代入式を含む) 式または変数宣言。ふつうはカウンター変数を初期化するために使われます。この式では任意で、 var キーワードを用いて新しい変数を宣言することもできます。 var で宣言された変数はループ内のローカル変数にはなりません。すなわち、 for ループが属するスコープと同じスコープになります。 let で宣言された変数は文内のローカル変数になります。
この式の結果は捨て去られます。
condition
ループのそれぞれの反復処理が行われる前に評価される式です。この式が true と評価された場合は、 statement が実行されます。この条件テストは省略可能です。省略された場合は、条件は常に true に評価されます。もしこの式が false と評価された場合は、実行は for 構造に続く最初の式に飛びます。
final-expression
ループのそれぞれの反復処理の最後に評価される式です。これは、次の condition の評価前に行われます。一般的には、カウンター変数を更新または増加するために使われます。
statement
条件が true と評価された場合に限り実行される文です。ループ内で複数の文を実行するには、ブロック文 ({ ... }) を使用して文をグループ化してください。ループ内で文を実行しないようにするには、空文 (;) を使用してください。

for の使用

次の for 文は、変数 i を宣言し、それを 0 に初期化することから始まります。i が 9 より小さいことをチェックし、続く 2 つの文を実行し、ループを通過した後ごとに i を 1 増加します。

for (let i = 0; i < 9; i++) {
   console.log(i);
   // その他の文
}

省略可能な for の式

for ループの先頭にある 3 つの式は、省略可能です。

例えば、 initialization ブロックで変数を初期化する必要はありません。

var i = 0;
for (; i < 9; i++) {
    console.log(i);
    // その他の文
}

initialization ブロックと同様に、 condition ブロックも省略可能です。この式を省略した場合は、本体の中でループを脱出できるようにして、無限ループにならないようにしなければなりません。

for (let i = 0;; i++) {
   console.log(i);
   if (i > 3) break;
   // その他の文
}

3 つのブロックをすべて省略することもできます。繰り返しますが、 break 文を使用してループを終了させ、また break 文の条件がある時点で true になるように、変数を変更 (増加) させていることを確認してください。

var i = 0;

for (;;) {
  if (i > 3) break;
  console.log(i);
  i++;
}

文を持たない for の使用

以下の for の繰り返しでは、 final-expression 句の中でにおけるノードのオフセット位置を検索しています。 statement 節を使用する必要がない場合は、代わりにセミコロンを使用してください。

function showOffsetPos(sId) {

  var nLeft = 0, nTop = 0;

  for (

    var oItNode = document.getElementById(sId); /* initialization */

    oItNode; /* condition */

    nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent /* final-expression */

  ); /* semicolon */ 

  console.log('Offset position of \'' + sId + '\' element:\n left: ' + nLeft + 'px;\n top: ' + nTop + 'px;');

}

/* 呼び出しの例 */

showOffsetPos('content');

// Output:
// "Offset position of "content" element:
// left: 0px;
// top: 153px;"
注: これは、セミコロンが必須となる JavaScript の数少ないケースの1つです。セミコロンがないと、繰り返し宣言の次の行が繰り返す文と見なされます。

仕様書

仕様書
ECMAScript (ECMA-262)
for statement の定義

ブラウザーの互換性

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

凡例

完全対応  
完全対応

関連情報