JavaScript中变量声明有var和没var的区别示例介绍

作者:纸飞机时间:2026-10-28 14:09:42浏览:176

本文深入解析JavaScript中变量声明使用var与不使用var的区别。通过对比局部与全局作用域,利用Object.getOwnPropertyDescriptor验证configurable属性差异,揭示delete操作的限制。同时阐述函数声明与函数表达式的提升机制,说明为何函数声明可提前调用而表达式不可,帮助开发者避免全局污染并理解变量作用域规则。

var与无var声明的区别

本文探讨JavaScript中变量声明是否使用var关键字的差异。在JS中,变量作用域以函数为基本单位,因此避免全局变量污染是常见需求。


(function(){ 
// ... 
})();

在函数内部,使用var声明的变量为局部变量,而不使用var声明的变量则成为全局变量,这常被用来向外暴露接口。在全局作用域中,无论是否使用var,声明的变量都会成为window对象的属性。为了探究两者是否完全相同,我们可以利用ECMAScript 5提供的属性特性查询方法进行比较。


var fff = 2; 
window.ffa = 3; 
ffb = 4; 
this.ffc = 4; 
var ffftx = Object.getOwnPropertyDescriptor(window, 'fff'); //configurable:false,enumerable:true,value:2,writable:true 
var ffatx = Object.getOwnPropertyDescriptor(window, 'ffa'); //configurable:true,enumerable:true,value:2,writable:true 
var ffbtx = Object.getOwnPropertyDescriptor(window, 'ffb'); //configurable:true,enumerable:true,value:2,writable:true 
var ffctx = Object.getOwnPropertyDescriptor(window, 'ffc'); //configurable:true,enumerable:true,value:2,writable:true

通过上述分析发现两者存在差异。进一步使用delete操作符删除属性可以验证这一点:配置性(configurable)为false的属性无法被删除。这意味着通过var声明的全局对象属性无法删除,且通过函数声明创建的全局对象属性同样无法删除。


delete fff; // 无法删除 
delete ffa; // 可删除 
delete ffb; // 可删除 
delete ffc; // 可删除

结论是,在全局变量声明中,加上var与不加var存在明确区别。

函数声明与表达式提升机制

使用var语句重复声明变量是合法且无害的。如果重复声明时带有赋值,则行为与普通赋值语句无异。若尝试读取未声明的变量,JavaScript会报错。在函数作用域内,声明的变量或内部函数在函数体内均可见,这意味着函数可能在定义之前就已可用。函数定义分为函数定义表达式和函数声明语句两种。


// 函数定义表达式 
var fns = function (){ 
// ... 
}; 
// 函数声明语句 
function fns(){ 
// ... 
} 

函数声明语句会被“提升”到外部脚本或外部函数作用域的顶部,因此以这种方式声明的函数可以在其定义之前被调用。而在函数定义表达式中,变量的声明会被提升,但赋值不会提升,因此以表达式方式定义的函数在定义之前无法调用。


(function() { 
testa(); // 打印出testa 
testb(); // 报错:提示undefined is not a function 
console.log(testc); //undefined,如果移到上面就可以了 
function testa() { 
console.log("testa"); 
} 
var testb = function() { 
console.log("tesb"); 
} 
var testc = "testc"; 
})();

当然,声明变量和函数时必须遵守基本规范,即变量和函数声明应当提前。

作者最新文章