JavaScript中变量声明使用var与不使用var的区别解析

作用域控制的差异：局部与全局

最直观的区别在于变量作用域的归属。在函数内部，使用 var 定义的变量仅在当前函数作用域内有效（局部变量）；而不使用 var 直接赋值，该变量会被添加到当前执行上下文的顶层对象中，即变成全局变量。即使变量是在函数内部定义的，未加 var 也会导致外部可访问。

第1步：观察有var声明的局部变量行为

目的：验证 var 声明将变量限制在函数内部。

var a = 'hello World';
function bb(){
 var a = 'hello Bill'; // 函数内局部变量，遮蔽了外部变量
 console.log(a);       
}
bb();      // 输出: 'hello Bill'
console.log(a);  // 输出: 'hello world' (外部变量未受影响)

第2步：观察无var声明的全局变量污染

目的：展示省略 var 如何意外修改全局状态。

var a = 'hello World';
function bb(){
 a = 'hello Bill'; // 未使用var，寻找作用域链，最终挂载到全局
 console.log(a);   
}
bb();      // 输出: 'hello Bill'
console.log(a);  // 输出: 'hello Bill' (全局变量a被意外修改)

删除权限的差异：属性 vs 变量

在全局作用域下，使用 var 声明的变量无法通过 delete 操作符删除，因为它具有 DontDelete 内部属性；而未使用 var 定义的“隐含全局变量”，本质上是被挂在 window 对象上的普通属性，因此可以通过 delete 删除。这说明隐含全局变量并非真正的变量，而是全局对象的属性。

第3步：测试不同声明方式的删除能力

参数：delete 操作符

// 方式一：var 声明的变量，不可删除
var globalVar = 'test';
delete globalVar; // 返回 false (在非严格模式下静默失败)，globalVar 依然存在

// 方式二：不加 var 定义的隐式全局变量，本质是属性，可以删除
globalImplicit = 'test';
delete globalImplicit; // 返回 true，该标识符不再存在

变量提升机制的差异

使用 var 声明的变量存在“声明提升”（Hoisting）现象。无论变量在代码块的何处声明，其声明部分都会被提升到作用域的顶部，但初始化仍在原地。这意味着在使用前引用它只会得到 undefined。而未使用 var 的直接赋值则不存在提升，如果在赋值前访问，会触发引用错误。

第4步：对比提前访问的行为结果

入口：函数体内代码逻辑

// 场景A：使用var，存在声明提升
function hhWithVar(){
 console.log(a); // 输出: undefined (已声明但未初始化)
 var a = 'hello world';
}
hhWithVar();

// 场景B：不使用var，不存在提升，属于未定义
function hhWithoutVar(){
 console.log(a); // 报错: ReferenceError: a is not defined
 a = 'hello world';
}
hhWithoutVar();

ES5严格模式的语法限制

在现代 JavaScript 开发中，强烈建议启用或遵循 ES5 的 'use strict' 模式。在此模式下，如果试图在不使用 var（或 let/const）的情况下赋值给一个未声明的标识符，引擎会抛出 ReferenceError 异常。

第5步：在严格模式下验证非法赋值

重要参数：'use strict'

'use strict';
(function() {
    implicitGlobal = 'this will fail'; // 在strict模式下，此行直接引发ReferenceError
})();

简要总结

综上所述，为了避免意外的全局变量污染、提升混淆以及严格的语法检查问题，在定义变量时应始终使用显式的声明关键字。虽然在旧版 JS 中省略 var 是一种常见写法，但其导致的“隐式全局变量”是许多 Bug 的根源。对于现代开发，推荐使用 let 和 const 来替代 var，以获得块级作用域和更安全的内存管理。 以上就是JavaScript中定义变量时有无var声明的区别的详细内容，更多关于JavaScript变量作用域的资料请关注本站其它相关文章！