大括号内的函数调用 {}

Question

我正在尝试使用主要提供商之一实施在线聊天。 他们建议我嵌入一个如下所示的代码：

<script type="text/javascript">
  function embedScriptInsideHTMLtags() {
    // responsible code
  }
  {
    embedScriptInsideHTMLtags();
  }
</script>

我的问题是，上面和下面有什么区别：

<script type="text/javascript">
  function embedScriptInsideHTMLtags() {
    // responsible code
  }  
  embedScriptInsideHTMLtags();
</script>

Answer 1

第一个例子是使用所谓的块语句。 在这种情况下，两个示例没有区别。 根据 MDN 链接：

在非严格模式下用 var 声明或由函数声明创建的变量没有块作用域。 块中引入的变量的作用域是包含函数或脚本，并且设置它们的效果在块本身之外持续存在。 换句话说，块语句不引入作用域。

但是在严格模式下

用 let 和 const 声明的标识符确实有块作用域

和

在严格模式下，从 ES2015 开始，块内的函数的作用域是该块。 在 ES2015 之前，严格模式下禁止块级函数。

Answer 2

您必须了解访问块外的 var 与访问块外的 let 和 const 之间的区别，一个是可能的（var）其他不是。

您的代码没有任何区别，但是

<script>
  function embedScriptInsideHTMLtags() {
    // responsible code
    return 'something';
  }
  {
    const b=embedScriptInsideHTMLtags();
  }
  const c= embedScriptInsideHTMLtags();
</script>

在这里，您可以从外部或其他脚本访问 c，但无法访问 b。 在你的情况下，如果你只是调用一个函数，那么它没有任何区别。

Answer 3

其他人已经回答了您的具体问题，但我还想指出，W3C 现在建议您从 JS <script>标签中省略 type 属性，并且自从 HTML5 规范在几年前出现以来。 该规范鼓励开发人员不要在标签中使用多余的 MIME 类型，就像text/javascript 。 当您使用将包含 JavaScript 代码的脚本标记时，您可以只编写没有任何属性的<script> 。 你可以从脚本标签的MDN 文档中阅读它

类似地，当为样式表使用<link>标记时（使用rel="stylesheet ，您不再需要使用type="text/css" 。由于 CSS 是 Web 上唯一可用的样式表类型，因此样式表现在是多余的。您可以从链接标签的MDN 文档中阅读更多相关信息。