浅谈JavaScript的全局变量与局部变量


Posted in Javascript onJune 10, 2016

一、JavaScript scope 的划分标准是function函数块,不是以 if、while、for来划分的

<script>
function f1(){
   alert("before for scope:"+i);    
 //i未赋值(并不是没有声明!使用未声明变量或函数会导致致命错误从而中断脚本执行)
 //此时i值为undefined
   for(var i=0; i<3;i++){
       alert("in for scope:"+i);}
 //i的值是0,1,2  
   alert(“after for scope:”+1);
  //i的值是3,此时已经在for scope之外,但i的值仍然保留为3
    while(true){
       var j=1;
       break;}
    alert(j);
  //j的值是1,此时已经在while scope之外,但j的值仍然保留为1
    if(true){
      var k=1;
    }
    alert(k);
  //k的值为1,此时已经在if scope之外,但k的值仍保留为1
}
f1();
//此时在函数块外调用函数,再次输出存在于f1这个function scope里的i j k变量
alert(i);
//error!!!原因是这里的i未声明(不是未赋值,区别f1的第一行输出),脚本错误,程序结束!
alert(j);    
//未执行
alert(k);
//未执行
</script>

二、JavaScript在执行之前会对整个脚本文件进行预编译(对脚本文件的声明部分做分析,包括局部变量部分),从而确定实变量的作用域。举个例子在下边:

<script>
   var x=1;
   function f2(){
    alert(x);
   //x的值为undefined!这个x并不是全局变量,因为在function scope已经又声明了一个重名的局部变量,所以全局变量的参数a被覆盖了。
    说明了JavaScript在执行前会进行预编译,函数体内的x就被指向局部变量,而不是全局变量。此时x只有声明,没有赋值,所以为undefined
    x=3;
    alert(x);
   //x值为3.但还是局部变量
    var x;
   //局部变量x在这里声明
    alert(x);
   //值为3
   }
   f2();
   alert(x);
   //x值为1,并不是在function scope内,x的值为全局变量的值。
</script>

三、当全局变量跟局部变量重名时,局部变量的scope会覆盖掉全局变量的scope,当离开局部变量的scope后,又重回到全局变量的scope,而当全局变量遇上局部变量时,

怎样使用全局变量呢?用window.globalVariableName。

<script>
   var a=1;
    function f3(){
       alert(window.a);
  //a位1,这里的a是全局变量
       var a=2;
        alert(a);
      }
    f3();
    alert(a);
</script>

以上这篇浅谈JavaScript的全局变量与局部变量就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery 框架使用教程 AJAX篇
Oct 11 Javascript
js实现星星打分效果的方法
Jul 05 Javascript
JavaScript实现下拉菜单的显示和隐藏
Jan 05 Javascript
node.js中的事件处理机制详解
Nov 26 Javascript
js如何获取网页所有图片
May 12 Javascript
js分页之前端代码实现和请求处理
Aug 04 Javascript
动态创建Angular组件实现popup弹窗功能
Sep 15 Javascript
vue左右侧联动滚动的实现代码
Jun 06 Javascript
Vue iview-admin框架二级菜单改为三级菜单的方法
Jul 03 Javascript
Vue路由管理器Vue-router的使用方法详解
Feb 05 Javascript
JavaScript React如何修改默认端口号方法详解
Jul 28 Javascript
react antd表格中渲染一张或多张图片的实例
Oct 28 Javascript
javaScript知识点总结(必看篇)
Jun 10 #Javascript
浅谈javascript基础之客户端事件驱动
Jun 10 #Javascript
用JavaScript获取页面文档内容的实现代码
Jun 10 #Javascript
老生常谈JavaScript数组的用法
Jun 10 #Javascript
jquery输入数字随机抽奖特效的简单实现代码
Jun 10 #Javascript
jQuery学习心得总结(必看篇)
Jun 10 #Javascript
修改js confirm alert 提示框文字的简单实例
Jun 10 #Javascript
You might like
小偷PHP+Html+缓存
2006/11/25 PHP
php array_push()数组函数:将一个或多个单元压入数组的末尾(入栈)
2011/07/12 PHP
PHP防盗链的基本思想 防盗链的设置方法
2015/09/25 PHP
PHP文件操作实例总结
2016/09/27 PHP
jquery UI 1.72 之datepicker
2009/12/29 Javascript
jquery实现textarea输入字符控制(仿微博输入控制字符)
2013/04/26 Javascript
JS(JQuery)操作Array的相关方法介绍
2014/02/11 Javascript
14款NodeJS Web框架推荐
2014/07/11 NodeJs
node.js中的fs.lstat方法使用说明
2014/12/16 Javascript
node.js 用socket实现聊天的示例代码
2017/10/17 Javascript
Flutter部件内部状态管理小结之实现Vue的v-model功能
2019/06/11 Javascript
vue获取验证码倒计时组件
2019/08/26 Javascript
多个vue子路由文件自动化合并的方法
2019/09/03 Javascript
webpack3.0升级4.0的方法步骤
2020/04/02 Javascript
js HTML DOM EventListener功能与用法实例分析
2020/04/27 Javascript
JS实现单张或多张图片持续无缝滚动的示例代码
2020/05/10 Javascript
python多线程抓取天涯帖子内容示例
2014/04/03 Python
Python函数式编程指南(三):迭代器详解
2015/06/24 Python
浅谈Python数据类型之间的转换
2016/06/08 Python
关于Python数据结构中字典的心得
2017/12/04 Python
Python用sndhdr模块识别音频格式详解
2018/01/11 Python
python使用matplotlib绘制热图
2018/11/07 Python
Python小进度条显示代码
2019/03/05 Python
详解Numpy中的数组拼接、合并操作(concatenate, append, stack, hstack, vstack, r_, c_等)
2019/05/27 Python
python中tkinter窗口位置\坐标\大小等实现示例
2020/07/09 Python
基于pycharm 项目和项目文件命名规则的介绍
2021/01/15 Python
阿巴庭院:Abba Patio
2019/06/18 全球购物
人事行政专员岗位职责
2014/07/23 职场文书
战略合作意向书
2014/07/29 职场文书
村委会贫困证明范本
2014/09/17 职场文书
党员干部群众路线个人整改措施
2014/09/18 职场文书
化工见习报告范文
2014/10/31 职场文书
海底两万里读书笔记
2015/06/26 职场文书
运动会开幕式通讯稿
2015/07/18 职场文书
导游词之太湖
2019/10/08 职场文书
基于Python实现股票收益率分析
2022/04/02 Python