JavaScript カンマ演算子

概要: このチュートリアルでは、JavaScript のカンマ演算子とその使用方法について学習します。

JavaScript カンマ演算子の紹介

JavaScript はカンマ (,) をカンマ演算子として使用します。カンマ演算子は 2 つの式を受け取り、左から右に評価し、右側の式の値を返します。

カンマ演算子の構文を次に示します。

leftExpression, rightExpression

例として

let result = (10, 10 + 20);
console.log(result);Code language: JavaScript (javascript)

出力

30

この例では、`10, 10+20` は右側の式の値、つまり `10+20` を返します。したがって、結果の値は 30 です。

次の例を参照してください。

let x = 10;
let y = (x++, x + 1);

console.log(x, y);Code language: JavaScript (javascript)

出力

11 12

この例では、x の値を 1 つ増やし (x++)、x に 1 を加算し (x+1)、x を y に代入します。したがって、この文の後、x は 11、y は 12 になります。

ただし、コードをより明確にするために、カンマ演算子を使用した 1 つの文ではなく、2 つの文を使用できます。

let x = 10;
x++;
let y = x + 1;

console.log(x, y);Code language: JavaScript (javascript)

このコードはより明確です。

実際には、ループごとに複数の変数を更新するために、`for` ループ内でカンマ演算子を使用したい場合があります。

次の例では、for ループ内でカンマ演算子を使用して、9 つの要素の配列を 3 行 3 列の行列として表示します。

let board = [1, 2, 3, 4, 5, 6, 7, 8, 9];

let s = '';
for (let i = 0, j = 1; i < board.length; i++, j++) {
  s += board[i] + ' ';
  if (j % 3 == 0) {
    console.log(s);
    s = '';
  }
}Code language: JavaScript (javascript)

出力

1 2 3
4 5 6
7 8 9

動作方法。

• ボードの初期化
  • コードはまず、1 から 9 までの値を持つ `board` という配列を定義することから始まります。この配列は、単純なボードまたはグリッドを表します。
• ボードのループ処理
  • 次に、コードは空の文字列 `s` を初期化し、`for` ループに入ります。
  • ループ内では、`i` と `j` の 2 つの変数が宣言されます。`i` は `board` 配列の要素を反復処理するために使用され、`j` は各反復でインクリメントされるカウンタです。
• 文字列の作成
  • ループ内では、`board` 配列の各要素が、スペースを付けて文字列 `s` に追加されます。
• 3 番目の要素の確認
  • 要素を文字列に追加した後、コードは剰余演算子 (%) を使用して、`j` (カウンタ) が 3 で均等に割り切れるかどうかを確認します。この条件 (j % 3 == 0) は、現在の反復が 3 番目の要素かどうかを確認します。
• 出力とリセット
  • 条件が真の場合 (3 番目の要素である場合)、現在の文字列 `s` が `console.log(s)` を使用してコンソールに出力されます。これにより、`board` から 3 つの要素の行が効果的に出力されます。
  • 次に、次の行のために文字列 `s` が空の文字列にリセットされます。
• ループの継続
  • ループは、`board` 配列のすべての要素が処理されるまで続きます。
• 出力
  • 最終的な出力は、それぞれ `board` 配列の 3 つの要素を含む一連の行です。

まとめ

• カンマ演算子は 2 つの式を受け取り、左から右に評価し、右側の式の値を返します。
• 複数の変数を一度に更新するために、`for` ループ内でカンマ演算子 (,) を使用します。
• 他の場所では、コードをより明確で理解しやすくするために、カンマ演算子ではなく 2 つの文を使用します。