基于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 相关文章推荐
jquery text(),val(),html()方法区别总结
Nov 04 Javascript
node.js中的fs.write方法使用说明
Dec 15 Javascript
浅析jQuery EasyUI中的tree使用指南
Dec 18 Javascript
jQuery中:header选择器用法实例
Dec 29 Javascript
新手快速学习JavaScript免费教程资源汇总
Jun 25 Javascript
基于bootstrap3和jquery的分页插件
Jul 31 Javascript
详解vue项目优化之按需加载组件-使用webpack require.ensure
Jun 13 Javascript
学习jQuery中的noConflict()用法
Sep 28 jQuery
对angularJs中ng-style动态改变样式的实例讲解
Sep 30 Javascript
Vue 组件修改根实例的数据的方法
Apr 02 Javascript
vue实现todolist基本功能以及数据存储功能实例详解
Apr 11 Javascript
关于vue路由缓存清除在main.js中的设置
Nov 06 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
php的ZipArchive类用法实例
2014/10/20 PHP
Java和PHP在Web开发方面对比分析
2015/03/01 PHP
php构造函数与析构函数
2016/04/23 PHP
php实现将二维关联数组转换成字符串的方法详解
2017/07/31 PHP
JQuery 选择和过滤方法代码总结
2010/11/19 Javascript
javascript:文字不间断向左移动的实例代码
2013/08/08 Javascript
jquery原创弹出层折叠效果点击折叠弹出一个层
2014/03/12 Javascript
javascript框架设计之种子模块
2015/06/23 Javascript
javascript基于prototype实现类似OOP继承的方法
2015/12/16 Javascript
JavaScript html5 canvas绘制时钟效果(二)
2016/03/27 Javascript
JS控制文本域只读或可写属性的方法
2016/06/24 Javascript
详解Javascript中DOM的范围
2017/02/13 Javascript
Node.js中 __dirname 的使用介绍
2017/06/19 Javascript
实现div内部滚动条滚动到底部和顶部的代码
2017/11/15 Javascript
three.js 入门案例详解
2018/01/23 Javascript
解决Vue的项目使用Element ui 走马灯无法实现的问题
2020/08/03 Javascript
vue实现标签云效果的示例
2020/11/09 Javascript
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
2020/12/15 Vue.js
vue绑定class的三种方法
2020/12/24 Vue.js
[07:27]DOTA2卡尔工作室 英雄介绍水晶室女篇
2013/06/21 DOTA
详解Python中的join()函数的用法
2015/04/07 Python
python编写爬虫小程序
2015/05/14 Python
Python发送form-data请求及拼接form-data内容的方法
2016/03/05 Python
详解Python使用simplejson模块解析JSON的方法
2016/03/24 Python
代码分析Python地图坐标转换
2018/02/08 Python
Python使用pylab库实现绘制直方图功能示例
2018/06/01 Python
解决Atom安装Hydrogen无法运行python3的问题
2019/08/28 Python
在pytorch中实现只让指定变量向后传播梯度
2020/02/29 Python
python属于跨平台语言码
2020/06/09 Python
日本最大的购物网站:日本乐天市场(Rakuten Ichiba)
2020/11/04 全球购物
寒假实习自荐信
2014/01/26 职场文书
机电职业生涯规划书范文
2014/03/08 职场文书
经理岗位职责范本
2015/04/15 职场文书
上班迟到检讨书范文
2015/05/06 职场文书
2015初中政教处工作总结
2015/07/21 职场文书
Python实现抖音热搜定时爬取功能
2022/03/16 Python