分組運算子 ( )

試一試

console.log(1 + 2 * 3); // 1 + 6
// Expected output: 7

console.log(1 + (2 * 3)); // 1 + 6
// Expected output: 7

console.log((1 + 2) * 3); // 3 * 3
// Expected output: 9

console.log(1 * 3 + 2 * 3); // 3 + 6
// Expected output: 9

語法

(expression)

引數

表示式

任何要計算的表示式，包括逗號連線的表示式。

描述

分組運算子由一對括號括起來的表示式組成，用於對內容進行分組。該運算子會覆蓋正常的運算子優先順序，因此優先順序較低的運算子（甚至低至逗號運算子）可以在優先順序較高的運算子之前進行計算。

示例

使用分組運算子

在乘法和除法之前計算加法和減法。

const a = 1;
const b = 2;
const c = 3;

// default precedence
a + b * c; // 7
// evaluated by default like this
a + (b * c); // 7

// now overriding precedence
// addition before multiplication
(a + b) * c; // 9

// which is equivalent to
a * c + b * c; // 9

請注意，在這些示例中，運算子計算的順序已更改，但運算元計算的順序未更改。例如，在此程式碼中，函式呼叫 a()、b() 和 c() 在考慮運算子順序之前從左到右（正常的計算順序）進行計算。

a() * (b() + c());

函式 a 將在函式 b 之前呼叫，函式 b 將在函式 c 之前呼叫。有關運算子優先順序的更多資訊，請參閱其參考頁。

使用分組運算子消除解析歧義

表示式語句不能以關鍵字 function 開頭，因為解析器會將其視為函式宣告的開始。這意味著以下 IIFE 語法無效

function () {
  // code
}();

分組運算子可以消除這種歧義，因為當解析器看到左括號時，它知道接下來必須是一個表示式而不是一個宣告。

(function () {
  // code
})();

你也可以使用 void 運算子來消除歧義。

在箭頭函式表示式體中（直接返回表示式而沒有關鍵字 return 的那種），分組運算子可以用於返回物件字面量表達式，因為否則左花括號將被解釋為函式體的開始。

const f = () => ({ a: 1 });

如果數字字面量上訪問屬性，屬性訪問器點 . 可能會與小數點混淆，除非數字已經包含小數點。你可以用括號將整數字面量括起來以消除這種歧義。

(1).toString(); // "1"

分組運算子和自動分號插入

分組運算子可以緩解自動分號插入（ASI）的陷阱。例如，return 關鍵字和返回的表示式之間不能有換行符

function sum(a, b) {
  return
    a + b;
}

這段程式碼將返回 undefined，因為在 return 關鍵字之後直接插入了一個分號，導致函式立即返回而沒有計算 a + b。如果返回的表示式很長並且你想保持其良好的格式，你可以使用分組運算子來表示 return 關鍵字後面跟著一個表示式，並防止分號插入

function sum(a, b) {
  return (
    a + b
  );
}

然而，分組也可能引入 ASI 危害。當一行以左括號開頭，並且前一行以表示式結尾時，解析器不會在換行符之前插入分號，因為它可能是函式呼叫的中間。例如

const a = 1
(1).toString()

這段程式碼將被解析為

const a = 1(1).toString();

這將丟擲“TypeError: 1 is not a function”。如果你的編碼風格不使用分號，請記住，當一行以左括號開頭時，在其前面加上一個分號。這種做法被一些格式化工具和/或風格指南推薦，包括 Prettier 和 standard。

const a = 1
;(1).toString()

有關處理 ASI 的更多建議，請參閱其參考部分。

規範

瀏覽器相容性

另見

• 運算子優先順序
• delete
• typeof