花括号 {} 内的函数调用答案

【问题标题】：Function invocation inside curly braces {}花括号 {} 内的函数调用
【发布时间】：2019-12-16 14:12:12
【问题描述】：

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

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

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

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

【问题讨论】：

没什么。

标签： javascript function curly-braces function-invocation

【解决方案1】：

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

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

但在严格模式

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

和

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

【讨论】：

【解决方案2】：

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

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

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

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

【讨论】：

【解决方案3】：

其他人已经回答了您的具体问题，但我还想指出，W3C 现在建议您从 JS <script> 标签中省略 type 属性，并且自 HTML5 规范于多年前问世以来就一直如此。该规范鼓励开发人员不要在标签中使用冗余的 MIME 类型，就像text/javascript 一样。当您使用包含 JavaScript 代码的脚本标签时，您可以只写 <script> 而没有任何属性。您可以从MDN documentation for the script tag 了解它

类似地，当对样式表使用<link> 标记时（使用rel="stylesheet，您不再需要使用type="text/css"。由于CSS 是Web 上唯一可用的样式表类型，样式表的type 属性为现在是多余的。您可以从MDN documentation for the link tag 了解更多信息。

【讨论】：

谢谢你，我相应地改变了我的答案。