JavaScript 变量提升 -HTML教程 -css5.net


JavaScript 变量提升

JavaScript引擎的工作方式是,先解析代码,获取一切被声明的变量,然后再一行一行地运行。这形成的结果,就是一切的变量的声明语句,都会被提升到代码的头部,这就叫做变量提升(hoisting)。

下面示例代码1和示例代码2将取得相同的结果:

示例代码 1

x = 5; // 你可以把变量 x 设置为 5

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x;                     // 这是在元素中显示 x

var x; // 声明 x


演示一下


示例代码 2

var x; // 声明 x
x = 5; // 变量 x 设置为 5

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x;                     // 在元素中显示 x


演示一下

hoisting(变量提升)。


一、JavaScript 初始化不会提升的

JavaScript 声明的变量会提升,并非初始化。

下面示例代码1和示例代码2将取得相同的结果:

示例代码 1

var x = 5; // 设置初始化 x
var y = 7; // 设置初始化 y

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x + " " + y;           // 此处显示 x 和 y


演示一下


示例代码 2

var x = 5; // 设置初始化 x

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x + " " + y;           // 此处显示 x 和 y

var y = 7; // 设置初始化 y


演示一下

示例代码 2 类似以下代码:

var x = 5; // 初始化 x

var y;     // 声明 y

elem = document.getElementById("demo"); // 查找元素

elem.innerHTML = x + " " + y;           // 显示 x 和 y

y = 7;    // 设置 y 为 7




二、相关参考文章

HTML 标签:HTML <kbd> 标签

Copyright © 2017 CSS5.NET教程.CSS5 内容仅用于学习和测试参考。 css5.net All Rights Reserved