Blockanweisung

Probieren Sie es aus

var x = 1;
let y = 1;

if (true) {
  var x = 2;
  let y = 2;
}

console.log(x);
// Expected output: 2

console.log(y);
// Expected output: 1

Syntax

{
  StatementList
}

StatementList

Anweisungen und Deklarationen, die innerhalb der Blockanweisung gruppiert sind.

Beschreibung

Die Blockanweisung wird in anderen Sprachen oft als zusammengesetzte Anweisung bezeichnet. Sie ermglicht es Ihnen, mehrere Anweisungen dort zu verwenden, wo JavaScript nur eine Anweisung erwartet. Das Kombinieren von Anweisungen zu Blcken ist eine gngige Praxis in JavaScript, insbesondere in Verbindung mit Kontrollflussanweisungen wie if...else und for. Das entgegengesetzte Verhalten ist durch die Verwendung einer leeren Anweisung mglich, bei der Sie keine Anweisung bereitstellen, obwohl eine erforderlich ist.

Darber hinaus knnen Blcke in Kombination mit blockweise deklarierten Variablen wie let, const und class verhindern, dass temporre Variablen den globalen Namensraum verschmutzen, hnlich wie IIFEs.

Block-Scope-Regeln mit var oder Funktionsdeklaration im Nicht-Strict-Modus

Variablen, die mit var deklariert werden oder durch Funktionsdeklarationen im Nicht-Strict-Modus erstellt werden, haben keinen Block-Scope. Im Block eingefhrte Variablen sind im Gltigkeitsbereich der enthaltenen Funktion oder des Skripts, und die Auswirkungen ihrer Zuweisung bestehen ber den Block hinaus. Zum Beispiel:

var x = 1;
{
  var x = 2;
}
console.log(x); // 2

Dies gibt 2 aus, weil die var x-Anweisung innerhalb des Blocks im gleichen Gltigkeitsbereich wie die var x-Anweisung vor dem Block liegt.

In Nicht-Strict-Code verhalten sich Funktionsdeklarationen innerhalb von Blcken merkwrdig. Verwenden Sie sie nicht.

Block-Scope-Regeln mit let, const, class oder Funktionsdeklaration im Strict-Modus

Im Gegensatz dazu haben Bezeichner, die mit let, const und class deklariert werden, Block-Scope:

let x = 1;
{
  let x = 2;
}
console.log(x); // 1

Das x = 2 ist im Gltigkeitsbereich auf den Block begrenzt, in dem es definiert wurde.

Das Gleiche gilt fr const:

const c = 1;
{
  const c = 2;
}
console.log(c); // 1; does not throw SyntaxError

Beachten Sie, dass das blocklokalisierte const c = 2 keinen SyntaxError: Identifier 'c' has already been declared auslst, da es eindeutig innerhalb des Blocks deklariert werden kann.

Im Strict-Modus sind Funktionsdeklarationen innerhalb von Blcken auf diesen Block beschrnkt und werden an die Spitze des Blocks hochgehoben.

"use strict";

{
  foo(); // Logs "foo"
  function foo() {
    console.log("foo");
  }
}

foo(); // ReferenceError: foo is not defined

Beispiele

Verwenden einer Blockanweisung als Krper einer for-Schleife

Eine for-Schleife akzeptiert eine einzelne Anweisung als ihren Krper.

for (let i = 0; i < 10; i++) console.log(i);

Wenn Sie mehr als eine Anweisung im Schleifenkrper verwenden mchten, knnen Sie sie in eine Blockanweisung gruppieren:

for (let i = 0; i < 10; i++) {
  console.log(i);
  console.log(i ** 2);
}

Verwenden einer Blockanweisung zur Datenkapselung

let- und const-Deklarationen sind auf den enthaltenen Block beschrnkt. Dadurch knnen Sie Daten vor dem globalen Gltigkeitsbereich verbergen, ohne sie in eine Funktion zu kapseln.

let sector;
{
  // These variables are scoped to this block and are not
  // accessible after the block
  const angle = Math.PI / 3;
  const radius = 10;
  sector = {
    radius,
    angle,
    area: (angle / 2) * radius ** 2,
    perimeter: 2 * radius + angle * radius,
  };
}
console.log(sector);
// {
//   radius: 10,
//   angle: 1.0471975511965976,
//   area: 52.35987755982988,
//   perimeter: 30.471975511965976
// }
console.log(typeof radius); // "undefined"

using-Deklarationen in einem Block

Sie knnen Variablen mit using oder await using in einem Block deklarieren, was bewirkt, dass das in der Variable gespeicherte Objekt beim Verlassen des Blocks entsorgt wird. Fr weitere Informationen siehe Ressourcenverwaltung.

{
  using reader1 = stream1.getReader();
  using reader2 = stream2.getReader();

  // do something with reader1 and reader2

  // Before we exit the block, reader1 and reader2 are automatically released
}

Spezifikationen

Browser-Kompatibilitt

Siehe auch

• while
• if...else
• let