javascript ES6中的匿名块是什么？

Question

我正在阅读pragmatists中有关ES6的新功能的信息。但是在这里您可以看到他们在该函数中使用了anonymous block。有人可以解释一下这是什么意思。它是任何JavaScript对象还是什么？我们如何使用它？还请提及一些参考。

function f() {
  var x = 1
  let y = 2
  const z = 3
  {
    var x = 100
    let y = 200
    const z = 300
    console.log('x in block scope is', x)
    console.log('y in block scope is', y)
    console.log('z in block scope is', z)
  }
  console.log('x outside of block scope is', x)
  console.log('y outside of block scope is', y)
  console.log('z outside of block scope is', z)
}

f()

Answer 1

使用let变量时，匿名块很有用。 var关键字声明的变量的作用域为立即函数主体，而let变量的作用域为{}表示的立即封闭块。

Answer 2

这只是一个空白。任何时候遇到裸露的块，您都可以认为它等同于：

for (let i = 0; i < 1; i++) {
  // block contents here
}

或

if (true) {
  // block contents here
}

没什么特别的，很少使用。其中最重要的部分可能是如何在其中声明的const和let变量的作用域仅限于块，而不是外部函数。

它具有与Javascript中所有非功能块相同的行为-类似于if块，while块或for块，但没有条件可以输入它，并且它只执行一次。

Answer 3

来自docs：

block语句在其他语言中通常称为compound statement。它允许您在JavaScript只需要一个语句的情况下使用多个语句。将语句组合成块是JavaScript中的一种常见做法。使用空语句可能会出现相反的行为，尽管需要提供一个空语句，但您不提供任何语句。

块通常与if...else和for语句结合使用。

根据您的示例：

function f() {
  const z = 3
  
    const z = 300
  
  console.log('z outside of block scope is', z)
}

f()

如果不使用块作用域，则会出现类似如下的错误：

SyntaxError：const z的重新声明

并且具有块范围：

function f() {
  const z = 3
  {
    const z = 300
    console.log('z in block scope is', z)
  }
  console.log('z outside of block scope is', z)
}

f()

相同的代码可以正常工作。请注意，基于块的const z = 300不会抛出SyntaxError，因为它可以在块内唯一声明。