expr1,expr2,expr3, …

One or more expressions, the last of which is returned as the value of the compound expression.

You can use the comma operator when you want to include multiple expressions in a location that requires a single expression. The most common usage of this operator is to supply multiple updaters in afor loop. For an idiom allowing multiplestatements in a location that requires a single expression, you may use anIIFE.

Because all expressions except the last are evaluated and then discarded, these expressions must have side effects to be useful. Common expressions that have side effects are assignments, function calls, and++ and-- operators. Others may also have side effects if they invokegetters or triggertype coercions.

The comma operator has the lowestprecedence of all operators. If you want to incorporate a comma-joined expression into a bigger expression, you must parenthesize it.

The comma operator is completely different from commas used as syntactic separators in other locations, which include:

• Elements in array initializers ([1, 2, 3])
• Properties inobject initializers ({ a: 1, b: 2 })
• Parameters infunction declarations/expressions (function f(a, b) { … })
• Arguments in function calls (f(1, 2))
• Binding lists inlet,const, orvar declarations (const a = 1, b = 2;)
• Import lists inimport declarations (import { a, b } from "c";)
• Export lists inexport declarations (export { a, b };)

In fact, although some of these places accept almost all expressions, they don't accept comma-joined expressions because that would be ambiguous with the syntactic comma separators. In this case, you must parenthesize the comma-joined expression. For example, the following is aconst declaration that declares two variables, where the comma is not the comma operator:

const a = 1, b = 2;

It is different from the following, whereb = 2 is anassignment expression, not a declaration. The value ofa is2, the return value of the assignment, while the value of1 is discarded:

const a = (1, b = 2);

Comma operators cannot appear astrailing commas.

Ifa is a 2-dimensional array with 10 elements on each side, the following code uses the comma operator to incrementi and decrementj at once, thus printing the values of the diagonal elements in the array:

const a = Array.from({ length: 10 }, () =>  Array.from({ length: 10 }, Math.random),); // A 10×10 array of random numbersfor (let i = 0, j = 9; i <= 9; i++, j--) {  console.log(`a[${i}][${j}] = ${a[i][j]}`);}

Because commas have the lowestprecedence — even lower than assignment — commas can be used to join multiple assignment expressions. In the following example,a is set to the value ofb = 3 (which is 3). Then, thec = 4 expression evaluates and its result becomes the return value of the entire comma expression.

let a, b, c;a = b = 3, c = 4; // Returns 4console.log(a); // 3 (left-most)let x, y, z;x = (y = 5, z = 6); // Returns 6console.log(x); // 6 (right-most)

Another example that one could make with the comma operator is processing before returning. As stated, only the last element will be returned but all others are going to be evaluated as well. So, one could do:

function myFunc() {  let x = 0;  return (x += 1, x); // the same as return ++x;}

This is especially useful for one-linearrow functions. The following example uses a singlemap() to get both the sum of an array and the squares of its elements, which would otherwise require two iterations, one withreduce() and one withmap():

let sum = 0;const squares = [1, 2, 3, 4, 5].map((x) => ((sum += x), x * x));console.log(squares); // [1, 4, 9, 16, 25]console.log(sum); // 15

The comma operator always returns the last expression as avalue instead of areference. This causes some contextual information such as thethis binding to be lost. For example, a property access returns a reference to the function, which also remembers the object that it's accessed on, so that calling the property works properly. If the method is returned from a comma expression, then the function is called as if it's a new function value, andthis isundefined.

const obj = {  value: "obj",  method() {    console.log(this.value);  },};obj.method(); // "obj"(obj.method)(); // "obj" (the grouping operator still returns the reference)(0, obj.method)(); // undefined (the comma operator returns a new value)

You can enterindirect eval with this technique, because direct eval requires the function call to happen on the reference to theeval() function.

globalThis.isDirectEval = false;{  const isDirectEval = true;  console.log(eval("isDirectEval")); // true  console.log((eval)("isDirectEval")); // true (the grouping operator still returns a reference to `eval`)  console.log((0, eval)("isDirectEval")); // false (the comma operator returns a new value)}

• for
• IIFE