浅谈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 相关文章推荐
javascript getElementsByTagName
Jan 31 Javascript
使用js检测浏览器的实现代码
May 14 Javascript
JavaScript lastIndexOf方法入门实例(计算指定字符在字符串中最后一次出现的位置)
Oct 17 Javascript
学习JavaScript设计模式(策略模式)
Nov 26 Javascript
JS实现全屏的四种写法
Dec 30 Javascript
js实现漫天星星效果
Jan 19 Javascript
AngularJS表单验证功能分析
May 26 Javascript
JS+HTML5 FileReader实现文件上传前本地预览功能
Mar 27 Javascript
关于微信小程序登录的那些事
Jan 08 Javascript
js获取对象,数组所有属性键值(key)和对应值(value)的方法示例
Jun 19 Javascript
Vue实现点击当前元素以外的地方隐藏当前元素(实现思路)
Dec 04 Javascript
分享8个JavaScript库可更好地处理本地存储
Oct 12 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
消息持续发送的完整例子
2006/10/09 PHP
有道搜索和IP138的IP的API接口(PHP应用)
2012/11/29 PHP
解析PHP 5.5 新特性
2013/07/02 PHP
深入解析Session是否必须依赖Cookie
2013/08/02 PHP
thinkPHP模板中for循环与switch语句用法示例
2016/11/30 PHP
两个SUBMIT按钮,如何区分处理
2006/08/22 Javascript
jquery中使用ajax获取远程页面信息
2011/11/13 Javascript
js跨浏览器实现将字符串转化为xml对象的方法
2013/09/25 Javascript
jQuery替换字符串(实例代码)
2013/11/13 Javascript
jquery Ajax 实现加载数据前动画效果的示例代码
2014/02/07 Javascript
理解javascript定时器中的单线程
2016/02/23 Javascript
jQuery ajax应用总结
2016/06/02 Javascript
实例讲解JavaScript中instanceof运算符的用法
2016/06/08 Javascript
form表单转Json提交的方法(推荐)
2016/09/23 Javascript
Bootstrap字体图标无法正常显示的解决方法
2016/10/08 Javascript
html、css和jquery相结合实现简单的进度条效果实例代码
2016/10/24 Javascript
微信小程序利用co处理异步流程的方法教程
2017/05/20 Javascript
Vue 中axios配置实例详解
2018/07/27 Javascript
JS实现提示效果弹出及延迟隐藏的功能
2019/08/26 Javascript
AngularJS动态生成select下拉框的方法实例
2019/11/17 Javascript
vue+openlayers绘制省市边界线
2020/12/24 Vue.js
[42:25]EG vs Spirit Supermajor 败者组 BO3 第二场 6.4
2018/06/05 DOTA
wxPython窗口的继承机制实例分析
2014/09/28 Python
django跳转页面传参的实现
2020/09/17 Python
python生成word合同的实例方法
2021/01/12 Python
银行办理业务介绍信
2014/01/18 职场文书
大学生优秀团员事迹材料
2014/01/30 职场文书
大学生家政服务项目创业计划书
2014/01/30 职场文书
高考寄语大全
2014/04/08 职场文书
《望庐山瀑布》教学反思
2014/04/22 职场文书
2015高三毕业寄语赠言
2015/02/27 职场文书
呼啸山庄读书笔记
2015/06/29 职场文书
2016应届毕业生自荐信范文
2016/01/28 职场文书
php7中停止php-fpm服务的方法详解
2021/05/09 PHP
浏览器常用基本操作之python3+selenium4自动化测试(基础篇3)
2021/05/21 Python
纯html+css实现Element loading效果
2021/08/02 HTML / CSS