浅谈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 相关文章推荐
jqgrid 简单学习笔记
May 03 Javascript
教你如何使用PHP输出中文JSON字符串
May 22 Javascript
jquery实现增加删除行的方法
Feb 03 Javascript
JavaScript自定义数组排序方法
Feb 12 Javascript
JS Attribute属性操作详解
May 19 Javascript
jquery实现拖动效果
Aug 10 Javascript
BootStrap入门教程(二)之固定的内置样式
Sep 19 Javascript
AngularJS实践之使用NgModelController进行数据绑定
Oct 08 Javascript
Vue2.0 UI框架ElementUI使用方法详解
Apr 14 Javascript
vue-mugen-scroll组件实现pc端滚动刷新
Aug 16 Javascript
微信小程序实现左侧滑栏过程解析
Aug 26 Javascript
微信小程序语音同步智能识别的实现案例代码解析
May 29 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
全国FM电台频率大全 - 22 重庆市
2020/03/11 无线电
自己动手,丰衣足食 - 短波框形天线制作
2021/03/01 无线电
php在线代理转向代码
2012/05/05 PHP
Laravel 集成微信用户登录和绑定的实现
2019/12/27 PHP
jQuery初学:find()方法及children方法的区别分析
2011/01/31 Javascript
javascript简易缓动插件(源码打包)
2012/02/16 Javascript
js单例模式的两种方案
2013/10/22 Javascript
Area 区域实现post提交数据的js写法
2014/04/22 Javascript
EasyUI的doCellTip实现鼠标放到单元格上提示单元格内容
2016/08/24 Javascript
jquery获取点击控件的绝对位置简单实例
2016/10/13 Javascript
功能强大的jquery.validate表单验证插件
2016/11/07 Javascript
使用nodejs爬取前程无忧前端技能排行
2017/05/06 NodeJs
微信小程序实现省市区三级地址选择
2020/06/21 Javascript
微信小程序工具函数封装
2019/10/28 Javascript
vue Cli 环境删除与重装教程 - 版本文档
2020/09/11 Javascript
Vue $attrs &amp; inheritAttr实现button禁用效果案例
2020/12/07 Vue.js
[07:31]DOTA2卡尔工作室 英雄介绍主宰篇
2013/06/25 DOTA
python访问类中docstring注释的实现方法
2015/05/04 Python
python执行子进程实现进程间通信的方法
2015/06/02 Python
浅谈Series和DataFrame中的sort_index方法
2018/06/07 Python
python实现京东秒杀功能
2018/07/30 Python
python用opencv完成图像分割并进行目标物的提取
2020/05/25 Python
CSS3 伪类选择器 nth-child()说明
2010/07/10 HTML / CSS
中国最大的名表商城:万表网
2016/08/29 全球购物
巴西葡萄酒销售网站:Wine.com.br
2017/11/07 全球购物
来自南加州灵感的工作和娱乐服装:TravisMathew
2019/05/01 全球购物
美国宠物护理专家:Revival Animal Health
2020/01/05 全球购物
几个判断型的面试题
2012/07/03 面试题
大学生毕业自我评价范文分享
2013/11/11 职场文书
最新自我评价范文
2013/11/16 职场文书
公司开业庆典策划方案
2014/06/04 职场文书
授权委托书(完整版)
2014/09/10 职场文书
英语四级考试作弊检讨书
2014/09/29 职场文书
李强为自己工作观后感
2015/06/11 职场文书
钢琴师观后感
2015/06/12 职场文书
Python Matplotlib绘制两个Y轴图像
2022/04/13 Python