本文通过具体代码示例，深入解析JavaScript中变量提升（Hoisting）与函数作用域的工作机制。重点阐述var声明在函数执行前被提升至作用域顶部的行为，以及未赋值变量默认值为undefined的特性。文章对比了显式声明与隐式全局变量在逻辑或（||）运算中的不同表现，帮助开发者理解为何提前访问变量会返回undefined而非预期值，从而避免常见的编程陷阱。
JavaScript变量提升与函数作用域机制详解
本文通过具体代码示例，展示相关现象。
建议使用Chrome浏览器，按F12或右键选择“审查元素”打开开发者工具，并在Console控制台输入代码。提示：在控制台输入代码时，按住Shift+Enter可实现代码换行。
具体代码如下：
var name = "xiaoming";
(function(){
var name = name || "小张";
console.info(name);
})();// 输出：小张
(function(){
name = name || "小张";
console.info(name);
})(); // 输出：xiaoming
(function(){
var name2= name;
var name = name || "小张";
console.info(name, name2);
})(); // 输出：小张 undefined执行结果的截图如下所示：
具体解释如下：
在JavaScript中。
代码如下：
function xxx(){
// 一堆代码...
// ...
var name2 = name;
var name = name || "小张";
// 一堆代码
}实际执行时会转换为以下等价形式：
代码如下：
function xxx(){
var name2 = undefined;
var name = undefined;
// 其他 var 也会被提前到最起始处
// 一堆代码...
// ...
name2 = name;
name = name || "小张";
// 一堆代码
}