JavaScript代码块（代码段）

心已赠人 2024-03-31 08:51 78阅读 0赞

## JavaScript代码块（代码段） ##

代码块就是使用 `<script>` 标签包含的 JavaScript 代码段。

示例1

在下面示例中，使用了两个 `<script>` 标签分别定义两个 JavaScript 代码块。

> 1.  `<script>`
> 2.  `//JavaScript 代码块 1`
> 3.  `var a = 1;`
> 4.  `</script>`
> 5.  `<script>`
> 6.  `//JavaScript 代码块 2`
> 7.  `function f(){`
> 8.  `alert(1);`
> 9.  `}`
> 10. `</script>`

浏览器在解析这个 HTML 文档时，如果遇到第一个 `<script>` 标签，则 JavaScript 解释器会等到这个代码块的代码都加载完后，再对代码块进行预编译，然后执行。执行完毕，将继续解析后面的 HTML 代码，同时 JavaScript 解释器也准备好处理下一个代码块。

示例2

如果在一个 JavaScript 代码块中调用后面代码块中声明的变量或函数，就会提示语法错误。例如，当 JavaScript 解释器执行下面代码时就会提示语法错误，显示变量 a 未定义。

> 1.  `<script>`
> 2.  `//JavaScript 代码块 1`
> 3.  `alert(a);`
> 4.  `</script>`
> 5.  `<script>`
> 6.  `//JavaScript 代码块 2`
> 7.  `var a = 1;`
> 8.  `</script>`

如果把两块代码放在一起，就不会出现上述错误。合并代码如下：

> 1.  `<script>`
> 2.  `//JavaScript 代码块`
> 3.  `alert(a);`
> 4.  `var a = 1;`
> 5.  `</script>`

温馨提示

JavaScript 是按块执行的，但是不同块都属于同一个作用域（全局作用域），下面块中的代码可以访问上面块中的变量。因此，如果把上面示例中两个代码块的顺序调换一下，就不会出现语法错误。

> 1.  `<script>`
> 2.  `//JavaScript 代码块 2`
> 3.  `var a = 1;`
> 4.  `</script>`
> 5.  `<script>`
> 6.  `//JavaScript 代码块 1`
> 7.  `alert(a);`
> 8.  `</script>`