JavaScript程序的执行_当用户浏览包含javascript程序的页面时,在()执行脚本-优快云博客

本文链接：https://blog.youkuaiyun.com/confirmAname/article/details/9044037

本文介绍了网页中JavaScript脚本的执行顺序与环境，包括不同位置脚本的执行时机、onload与onunload事件句柄的作用及限制，以及Window对象作为执行环境的角色。还探讨了客户端JavaScript的单线程模型及其对用户体验的影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

① 执行脚本

出现在<script>和</script>标记对之间的JavaScript语句按照它们在脚本中出现的顺序来执行。当一个文件有多个脚本的时候，脚本按照它们出现的顺序来执行。脚本可以出现在一个HTML文档的<head>或<body>中。<head>中的脚本通常定义了将要被其他代码调用的函数。文档的<head>中的脚本定义一个函数，并且将这个函数作为稍后执行的一个onload事件句柄来注册，这是很普通的。在一个文档的<head>中调用document.write( )是合法的，但却不常见。一个文档的<body>中的脚本可以做到<head>中脚本所能够做到的一切。可是在这些脚本中调用document.write( )更加常见。

② onload事件句柄

可以通过设置<body>标记的onload属性来注册一个onload句柄。当onload句柄被触发的时候，文档会完整地载入和解析，并且任何文档元素都可以被JavaScript代码操作。因此修改文档内容的JavaScript模块通常会包含一个执行修改的函数，以及当文档完全载入的时候负责安排函数调用的事件注册代码。由于onload事件句柄在文档完全解析之后调用，它们不能调用document.write( ).任何这样的调用都重新打开一个新的文档并且覆盖掉当前文档，而不是在当前文档后面添加内容；用户甚至没有机会看到当前文档。

③ onunload事件句柄

当用户导航离开一个web页面，浏览器触发onunload事件句柄，给该页面上的JavaScript代码最后一次运行机会。可以通过设置<body>标记的onunload属性来定义一个onunload句柄。onunload句柄不应该运行任何耗费时间的操作，它也不应该弹出一个对话框。它的退出只是执行一个快速的清理操作，运行它不应该减慢或阻止用户转向一个新的页面。

④ 作为执行环境的Window对象

文档中所有的脚本，事件句柄和JavaScript URL都共享同一个Window对象作为它们的全局对象。JavaScript变量和函数只不过是这个全局对象的属性。

由于onload事件在所有脚本都执行之前并不会调用，每个onload事件句柄都能够访问文档中所有脚本所定义的所有函数以及所声明的所有变量。

不管何时，当一个新的对象载入到一个窗口中，该窗口的Window对象被恢复到其默认状态：之前的文档中的脚本所定义的所有属性和函数都被删除，并且可能已经修改或覆盖的任何标准系统属性都被恢复。每个文档都以一个清白的历史开始。

⑤ 客户端JavaScript线程模型

核心JavaScript语言并不包含任何线程机制，并且客户端JavaScript也没有增加任何线程机制。客户端JavaScript是单线程的。当脚本载入和执行的时候，文档解析就停止下来，并且当事件句柄执行的时候，Web浏览器会停止对用户输入的响应。

单线程执行是为更加简单的脚本而制定的，可以编写代码同时确保两个事件句柄不会同时运行。可以操作文档内容，而且事先知道不会有其他的线程试图同时修改文档。

单线程执行也会给JavaScript程序员带来负担，这意味着JavaScript脚本和事件句柄不能运行太长时间。如果一个脚本执行计算密集的任务，它将会为文档载入带来一个延迟，而用户无法在脚本完成前看到文档内容。如果一个事件句柄执行计算密集的任务，浏览器可能变得无法响应，可能会导致用户认为浏览器奔溃了。

如果应用程序必须执行足够的计算从而导致显著的延迟，应该允许文档在执行这个计算之前完全载入，应该确保能够通知用户计算正在进行中并且浏览器没有挂起。如果可能将计算分解为离散的子任务，可以使用setTimeout( )和setInterval( )这样的方法在后台运行子任务，同时更新一个进度指示器来向用户显示反馈。