基于JavaScript 声明全局变量的三种方式详解


Posted in Javascript onMay 07, 2013

JS中声明全局变量主要分为显式声明或者隐式声明下面分别介绍。

声明方式一:

使用var(关键字)+变量名(标识符)的方式在function外部声明,即为全局变量,否则在function声明的是局部变量。该方式即为显式声明详细如下:

<script> 
  var test = 5;//全局变量 
  function a(){ 
    var a = 3;//局部变量 
    alert(a); 
  } 
  function b(){ 
    alert(test); 
  } 
  //a();//调用a方法,那么方法里面的内容才会执行 
  //b();//同上 
</script>

声明方式二:

没有使用var,直接给标识符test赋值,这样会隐式的声明了全局变量test。即使该语句是在一个function内,当该function被执行后test变成了全局变量。

<script> 
    test = 5;//全局变量 
    function a(){ 
      aa = 3;//也是全局变量 
      alert(test); 
    } 
    //a();  //输出5 
    //alert(aa);//这里也可以方法a()方法里面的变量,因为aa是全局变量 
  </script>

声明方式三:

使用window全局对象来声明,全局对象的属性对应也是全局变量,详细如下:

<script> 
  window.test = 50; 
  alert(test);//输出50 
</script>

这种方式经常被用到一个匿名函数执行后将一些函数公开到全局。 如JQuery1.5中最末一句
代码如下:

window.jQuery = window.$ = jQuery;

全局变量的优点:

可以减少变量的个数,减少由于实际参数和形式参数的数据传递带来的时间消耗。

全局变量的缺点:

(1)全局变量保存在静态存贮区,程序开始运行时为其分配内存,程序结束释放该内存。与局部变量的动态分配、动态释放相比,生存期比较长,因此过多的全局变量会占用较多的内存单元。

(2)全局变量破坏了函数的封装性能。函数象一个黑匣子,一般是通过函数参数和返回值进行输入输出,函数内部实现相对独立。但函数中如果使用了全局变量,那么函数体内的语句就可以绕过函数参数和返回值进行存取,这种情况破坏了函数的独立性,使函数对全局变量产生依赖。同时,也降低了该函数的可移植性。

(3)全局变量使函数的代码可读性降低。由于多个函数都可能使用全局变量,函数执行时全局变量的值可能随时发生变化,对于程序的查错和调试都非常不利。
因此,如果不是万不得已,最好不要使用全局变量。

Javascript 相关文章推荐
JavaScript进阶教程(第四课第一部分)
Apr 05 Javascript
jquery load()在firefox(火狐)下显示不正常的解决方法
Apr 05 Javascript
微信小程序  自定义创建详细介绍
Oct 27 Javascript
javascript输出AscII码扩展集中的字符方法
Dec 26 Javascript
js实现QQ面板拖拽效果(慕课网DOM事件探秘)(全)
Sep 19 Javascript
JS实现碰撞检测的方法分析
Jan 19 Javascript
Vue中this.$router.push参数获取方法
Feb 27 Javascript
bootstrap select2插件用ajax来获取和显示数据的实例
Aug 09 Javascript
对 Vue-Router 进行单元测试的方法
Nov 05 Javascript
Node.js 如何利用异步提升任务处理速度
Jan 07 Javascript
ES6基础之展开语法(Spread syntax)
Feb 21 Javascript
vue图片加载失败时用默认图片替换的方法
Aug 29 Javascript
你必须知道的JavaScript 变量命名规则详解
May 07 #Javascript
你必须知道的JavaScript 中字符串连接的性能的一些问题
May 07 #Javascript
基于JavaScript实现继承机制之构造函数方法对象冒充的使用详解
May 07 #Javascript
基于JavaScript实现继承机制之调用call()与apply()的方法详解
May 07 #Javascript
JS中的substring和substr函数的区别说明
May 07 #Javascript
js图片自动切换效果处理代码
May 07 #Javascript
JavaScript通过RegExp实现客户端验证处理程序
May 07 #Javascript
You might like
windows xp下安装pear
2006/12/02 PHP
win7+apache+php+mysql环境配置操作详解
2013/06/10 PHP
php5.5新数组函数array_column使用
2013/07/08 PHP
ThinkPHP3.1新特性之对Ajax的支持更加完善
2014/06/19 PHP
php数组生成html下拉列表的方法
2015/07/20 PHP
PHP标准类(stdclass)用法示例
2016/09/28 PHP
一个加载js文件的小脚本
2007/06/28 Javascript
JS的replace方法介绍
2012/10/20 Javascript
js中判断用户输入的值是否为空的简单实例
2013/12/23 Javascript
jquery each的几种常用的使用方法示例
2014/01/21 Javascript
JavaScript编程的10个实用小技巧
2014/04/18 Javascript
利用js制作html table分页示例(js实现分页)
2014/04/25 Javascript
jQuery操作元素css样式的三种方法
2014/06/04 Javascript
javascript实现捕捉键盘上按下的键
2015/05/05 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
2016/08/29 Javascript
js无提示关闭浏览器窗口的两种方法分析
2016/11/06 Javascript
webstorm添加vue.js支持的方法教程
2017/07/05 Javascript
在微信小程序中使用图表的方法示例
2019/04/25 Javascript
keep-alive不能缓存多层级路由菜单问题解决
2020/03/10 Javascript
Python中__name__的使用实例
2015/04/14 Python
在Python中操作文件之truncate()方法的使用教程
2015/05/25 Python
python利用Guetzli批量压缩图片
2017/03/23 Python
python 函数传参之传值还是传引用的分析
2017/09/07 Python
Python实现的爬取小说爬虫功能示例
2019/03/30 Python
TensorFlow索引与切片的实现方法
2019/11/20 Python
Python实现查找数据库最接近的数据
2020/06/08 Python
css3 中实现炫酷的loading效果
2019/04/26 HTML / CSS
html5 canvas fillRect坐标和大小的问题解决方法
2014/03/26 HTML / CSS
法国房车租赁网站:Yescapa
2019/08/26 全球购物
类成员函数的重载、覆盖和隐藏区别
2016/01/27 面试题
资助贫困学生倡议书
2014/05/16 职场文书
法学专业毕业实习自我鉴定2014
2014/09/27 职场文书
2014年质检员工作总结
2014/11/18 职场文书
超市主管竞聘书
2015/09/15 职场文书
实操Python爬取觅知网素材图片示例
2021/11/27 Python
CSS中calc(100%-100px)不加空格不生效
2023/05/07 HTML / CSS