基于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 表单的友好用户体现
Jan 07 Javascript
Extjs3.0 checkboxGroup 动态添加item实现思路
Aug 14 Javascript
jQuery知识点整理
Jan 30 Javascript
JavaScript简单修改窗口大小的方法
Aug 03 Javascript
省市选择的简单实现(基于zepto.js)
Jun 21 Javascript
JavaScript中访问id对象 属性的方式访问属性(实例代码)
Oct 28 Javascript
基于JS实现移动端左滑删除功能
Jul 28 Javascript
javascript实现QQ空间相册展示源码
Dec 12 Javascript
微信小程序如何获取用户手机号
Jan 26 Javascript
基于React Native 0.52实现轮播图效果
Aug 25 Javascript
详解vue中axios请求的封装
Apr 08 Javascript
vue-cli中实现响应式布局的方法
Mar 02 Vue.js
你必须知道的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
PHP 杂谈《重构-改善既有代码的设计》之四 简化条件表达式
2012/04/09 PHP
php遍历文件夹所有文件子文件夹函数代码
2013/11/27 PHP
PHP 反射(Reflection)使用实例
2015/05/12 PHP
PHP使用反射机制实现查找类和方法的所在位置
2016/04/22 PHP
PHP CURL与java http使用方法详解
2018/01/26 PHP
JavaScript中关于indexOf的使用方法与问题小结
2010/08/05 Javascript
js 创建快捷方式的代码(fso)
2010/11/19 Javascript
jQuery Ajax方法调用 Asp.Net WebService 的详细实例代码
2011/04/27 Javascript
js+css实现导航效果实例
2015/02/10 Javascript
浅析Bootstrap缩略图组件与警示框组件
2016/04/29 Javascript
AngularJS实现表单验证功能
2017/01/09 Javascript
Vue官方文档梳理之全局配置
2017/11/22 Javascript
JavaScript实现获取select下拉框中第一个值的方法
2018/02/06 Javascript
React 源码中的依赖注入方法
2018/11/07 Javascript
Three.JS实现三维场景
2018/12/30 Javascript
VUE v-model表单数据双向绑定完整示例
2019/01/21 Javascript
layui 阻止图片上传的实例(before方法)
2019/09/26 Javascript
[05:48]DOTA2英雄梦之声vol21 屠夫
2014/06/20 DOTA
[03:01]完美盛典趣味短片 DOTA2年度最佳&拉胯英雄
2019/12/07 DOTA
Python使用MD5加密字符串示例
2014/08/22 Python
python3利用Dlib19.7实现人脸68个特征点标定
2018/02/26 Python
Python基础学习之类与实例基本用法与注意事项详解
2019/06/17 Python
pandas DataFrame 交集并集补集的实现
2019/06/24 Python
Python中函数的返回值示例浅析
2019/08/28 Python
python基于celery实现异步任务周期任务定时任务
2019/12/30 Python
python通过安装itchat包实现微信自动回复收到的春节祝福
2020/01/19 Python
Python如何使用OS模块调用cmd
2020/02/27 Python
Django模板标签中url使用详解(url跳转到指定页面)
2020/03/19 Python
基于Python实现下载网易音乐代码实例
2020/08/10 Python
python字典按照value排序方法
2020/12/28 Python
css3 旋转按钮 使用CSS3创建一个旋转可变色按钮
2012/12/31 HTML / CSS
详解background属性的8个属性值(面试题)
2020/11/02 HTML / CSS
美国时尚假发购物网站:Wigsbuy
2019/04/06 全球购物
波兰珠宝品牌:YES
2019/08/09 全球购物
Mountain Hardwear官网:攀岩服装和户外装备
2019/09/26 全球购物
英语教研活动总结
2014/07/02 职场文书