Gruppierungsoperator ( )
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Der Gruppierungsoperator ( )
kontrolliert die Vorrangregeln der Auswertung in Ausdrücken. Außerdem fungiert er in bestimmten syntaktischen Konstrukten als Container für beliebige Ausdrücke, wo sonst Mehrdeutigkeiten oder Syntaxfehler auftreten würden.
Probieren Sie es aus
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
Syntax
(expression)
Parameter
expression
-
Jeder beliebige Ausdruck, der ausgewertet werden soll, einschließlich durch Komma verbundener Ausdrücke.
Beschreibung
Der Gruppierungsoperator besteht aus einem Paar von Klammern, die einen Ausdruck umschließen und dessen Inhalt gruppieren. Er setzt die normale Operator-Vorrangregel außer Kraft, sodass Operatoren mit niedriger Priorität (so niedrig wie der Komma-Operator) vor einem Operator mit höherer Priorität ausgewertet werden können.
Beispiele
Verwendung des Gruppierungsoperators
Addition und Subtraktion werden vor Multiplikation und Division ausgewertet.
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
Beachten Sie in diesen Beispielen, dass sich die Reihenfolge der Operatoren, aber nicht die Reihenfolge der Operanden geändert hat. Zum Beispiel werden in diesem Code die Funktionsaufrufe a()
, b()
und c()
von links nach rechts ausgewertet (die normale Auswertungsreihenfolge), bevor die Reihenfolge der Operatoren berücksichtigt wird.
a() * (b() + c());
Die Funktion a
wird vor der Funktion b
aufgerufen, und diese wiederum vor der Funktion c
. Weitere Informationen zur Operator-Präzedenz finden Sie auf der entsprechenden Referenzseite.
Verwendung des Gruppierungsoperators zur Beseitigung von Parser-Mehrdeutigkeit
Ein Ausdrucksstatement kann nicht mit dem Schlüsselwort function
beginnen, da der Parser dies als Beginn einer Funktionsdeklaration ansehen würde. Dies macht die folgende IIFE-Syntax ungültig:
function () {
// code
}();
Der Gruppierungsoperator kann verwendet werden, um diese Mehrdeutigkeit zu beseitigen, da der Parser, sobald er die linke Klammer sieht, weiß, dass das Folgende ein Ausdruck und keine Deklaration sein muss.
(function () {
// code
})();
Sie können auch den void
-Operator verwenden, um Mehrdeutigkeiten zu vermeiden.
Im Ausdrucksteil einer Pfeilfunktion (der direkt einen Ausdruck ohne das Schlüsselwort return
zurückgibt) kann der Gruppierungsoperator verwendet werden, um ein Objektliteral zurückzugeben, da andernfalls die linke geschweifte Klammer als Beginn des Funktionskörpers interpretiert würde.
const f = () => ({ a: 1 });
Wenn auf ein numerisches Literal eine Eigenschaft zugegriffen wird, könnte der Eigenschaftszugriffsoperator .
mit einem Dezimalpunkt verwechselt werden, es sei denn, die Zahl enthält bereits einen Dezimalpunkt. Sie können integer Literale in Klammern einschließen, um diese Mehrdeutigkeit zu eliminieren.
(1).toString(); // "1"
Gruppierungsoperator und automatische Semikolon-Einfügung
Der Gruppierungsoperator kann Fallstricke der automatischen Semikolon-Einfügung (ASI) abmildern. Zum Beispiel darf das Schlüsselwort return
und der zurückgegebene Ausdruck nicht durch einen Zeilenumbruch getrennt sein:
function sum(a, b) {
return
a + b;
}
Dieser Code gibt undefined
zurück, da direkt nach dem Schlüsselwort return
ein Semikolon eingefügt wird, was dazu führt, dass die Funktion sofort zurückkehrt, ohne a + b
auszuwerten. Falls der zurückgegebene Ausdruck lang ist und Sie ihn gut formatiert halten möchten, können Sie den Gruppierungsoperator verwenden, um anzuzeigen, dass das Schlüsselwort return
von einem Ausdruck gefolgt wird, und so die Semikoloneinfügung verhindern:
function sum(a, b) {
return (
a + b
);
}
Allerdings kann die Gruppierung auch ASI-Probleme verursachen. Wenn eine Zeile mit einer linken Klammer beginnt und die vorherige Zeile mit einem Ausdruck endet, fügt der Parser kein Semikolon vor dem Zeilenumbruch ein, da es sich um die Mitte eines Funktionsaufrufs handeln könnte. Zum Beispiel:
const a = 1
(1).toString()
Dieser Code wird so geparst:
const a = 1(1).toString();
Was "TypeError: 1 is not a function" auslöst. Wenn Ihr Programmierstil keine Semikolons verwendet, denken Sie daran, dass Sie, wenn eine Zeile mit einer linken Klammer beginnt, diese mit einem Semikolon einleiten. Diese Praxis wird von mehreren Formatierern und/oder Styleguides wie Prettier und Standard empfohlen:
const a = 1
;(1).toString()
Weitere Ratschläge zum Umgang mit ASI finden Sie in der entsprechenden Referenzsektion.
Spezifikationen
Specification |
---|
ECMAScript® 2025 Language Specification # sec-grouping-operator |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | server | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Grouping operator () |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support