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

 更新时间:2014年09月15日 17:01:45   投稿:whsnow  
在函数内部,有var和没var声明的变量是不一样的。有var声明的是局部变量,没var的,声明的全局变量,所以可以借此向外暴露接口东东

本文来论述JavaScript中变量声明有var和没var的区别,关于Js中的变量声明的作用域是以函数为单位,所以我们经常见到避免全局变量污染的方法是

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

在函数内部,有var和没var声明的变量是不一样的。有var声明的是局部变量,没var的,声明的全局变量,所以可以借此向外暴露接口东东。
在全局作用域内声明变量时,有var 和没var看起来都一样,我们知道,声明的全局变量,就是window的属性,究竟是否一样,我们通过ECMAScrpit5提供的属性的特性查询方法,来发现之间的区别。

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删除属性来验证下,配置性为false的属性无法删除。也就是通过变量var声明全局对象的属性无法删除,我们还会发现和函数声明创建的全局对象属性也无法删除。

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

结论就是,加上var 和没加 var的声明全局变量是有区别的。

使用var语句重复声明语句是合法且无害的。如果重复声明且带有赋值,那么就和一般的赋值语句没差别。如果尝试读取没有声明过的变量,Js会报错。
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"; 
})();

当然,我们声明变量和函数,必须遵守基本的规范,变量和函数声明要提前。

相关文章

  • JavaScript实现的数字与字符串转换功能示例

    JavaScript实现的数字与字符串转换功能示例

    这篇文章主要介绍了JavaScript实现的数字与字符串转换功能,涉及javascript数字、字符串等运算与转换相关操作技巧,需要的朋友可以参考下
    2017-08-08
  • javascript实现动态CSS换肤技术的脚本

    javascript实现动态CSS换肤技术的脚本

    javascript实现动态CSS换肤技术的脚本...
    2007-06-06
  • 如何利用Javascript生成平滑曲线详解

    如何利用Javascript生成平滑曲线详解

    相信大家都遇到过,在各种图表框架中经常会有将一段折线平滑的需求,不仅能给用户带来一种柔和的感觉,还能美化界面,让折线看起来没那么生硬,这篇文章主要给大家介绍了关于如何利用Javascript生成平滑曲线的相关资料,需要的朋友可以参考下
    2021-07-07
  • bootstrap实现每隔5秒自动轮播效果

    bootstrap实现每隔5秒自动轮播效果

    这篇文章主要介绍了bootstrap实现每隔5秒自动轮播效果,可以自己设置轮播间隔时间,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • 在layer弹层layer.prompt中,修改placeholder的实现方法

    在layer弹层layer.prompt中,修改placeholder的实现方法

    今天小编大家分享一篇在layer弹层layer.prompt中,修改placeholder的实现方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • js实现文章文字大小字号功能完整实例

    js实现文章文字大小字号功能完整实例

    这篇文章主要介绍了js实现文章文字大小字号功能的实现方法,可根据用户习惯调整显示文字的大小.详细讲述了实现这一功能的完整步骤.是非常实用的技巧,需要的朋友可以参考下
    2014-11-11
  • js实现简单的点名器随机色实例代码

    js实现简单的点名器随机色实例代码

    这篇文章主要给大家介绍了关于js实现简单的点名器随机色的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-09-09
  • JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题

    JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题

    这篇文章主要介绍了JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题的相关资料,需要的朋友可以参考下
    2015-12-12
  • JavaScript快速实现日历效果

    JavaScript快速实现日历效果

    这篇文章主要为大家详细介绍了JavaScript快速实现日历效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-03-03
  • 微信小程序实现倒计时

    微信小程序实现倒计时

    这篇文章主要为大家详细介绍了微信小程序实现倒计时,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-05-05

最新评论