Question

我正在尝试理解此源代码以学习如何制作艺术块。

https://api.artblocks.io/generator/9000000

代码如下：

<script>
  'use strict';
  {
    ....
  }
</script>

为什么 HTML 中的整个脚本都用花括号括起来？为什么脚本仍然有效？

Answer 1

这只是一个普通的块。

<块引用>

为什么 HTML 中的整个脚本都用花括号括起来？

大概是为了避免创建或干扰全局变量——比如 IIFE。否则，如果整个脚本都在顶层，可能会导致在同一页面上运行的其他脚本出现问题。

例如，如果有

<script>
// script 1
const someElement = document.querySelector('.something');
</script>

<script>
// unrelated script 2
const someElement = document.querySelector('.somethingElse');
</script>

会抛出错误，因为两个脚本都使用它们的变量填充顶层。将独立脚本放入自己的块中可以显着降低名称冲突的可能性，因此

<script>
// script 1
{
  const someElement = document.querySelector('.something');
  // other code
}
</script>

也就是说，IIFE is probably a better approach - 它更常见、更兼容，并且没有 problems with function declarations。

<script>
// script 1
(function() {
  const someElement = document.querySelector('.something');
  // other code
})();
</script>

Answer 2

在 JavaScript 中，大括号用于创建新块。放置大括号是为了确保没有代码与内部代码冲突，反之亦然，确保大括号中的代码不会影响其他代码。

为什么这个 HTML javascript 用花括号括起来？

2 个答案: