浅谈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 相关文章推荐
利用js动态添加删除table行的示例代码
Dec 16 Javascript
jQuery中dequeue()方法用法实例
Dec 29 Javascript
AngularJS过滤器filter用法分析
Dec 11 Javascript
js读取json文件片段中的数据实例
Mar 09 Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
Apr 01 Javascript
利用jQuery解析获取JSON数据
Apr 08 jQuery
基于AngularJS实现的工资计算器实例
Jun 16 Javascript
js实现关闭网页出现是否离开提示
Dec 07 Javascript
总结4个方面优化Vue项目
Feb 11 Javascript
优雅的将ElementUI表格变身成树形表格的方法步骤
Apr 11 Javascript
详解vue-cli+element-ui树形表格(多级表格折腾小计)
Apr 17 Javascript
JavaScript进阶(一)变量声明提升实例分析
May 09 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显示MySQL数据的三种方法
2008/06/05 PHP
php加密算法之实现可逆加密算法和解密分享
2014/01/21 PHP
主流PHP框架的优缺点对比分析
2014/12/25 PHP
PHP中类的自动加载的方法
2017/03/17 PHP
jQuery 连续列表实现代码
2009/12/21 Javascript
利用JS进行图片的切换即特效展示图片
2013/12/03 Javascript
JS与jQ读取xml文件的方法
2015/12/08 Javascript
js命名空间写法示例
2015/12/18 Javascript
javascript实现表单验证
2016/01/29 Javascript
深入理解JS DOM事件机制
2016/08/06 Javascript
Angular2.0/4.0 使用Echarts图表的示例代码
2017/12/07 Javascript
ES6 Iterator接口和for...of循环用法分析
2019/07/31 Javascript
[01:01:51]EG vs VG Supermajor小组赛B组 BO3 第二场 6.2
2018/06/03 DOTA
python实现的阳历转阴历(农历)算法
2014/04/25 Python
python的paramiko模块实现远程控制和传输示例
2017/10/13 Python
单链表反转python实现代码示例
2018/02/08 Python
详解TensorFlow在windows上安装与简单示例
2018/03/05 Python
在终端启动Python时报错的解决方案
2020/11/20 Python
利用CSS3的transform做的动态时钟效果
2011/09/21 HTML / CSS
css3中检验表单的required,focus,valid和invalid样式
2014/02/21 HTML / CSS
html5的新增的标签和废除的标签简要概述
2013/02/20 HTML / CSS
美国中小型企业领先的办公家具供应商:Office Designs
2016/11/26 全球购物
美国木工工具和用品商店:Woodcraft
2019/10/30 全球购物
简述Linux文件系统通过i节点把文件的逻辑结构和物理结构转换的工作过程
2012/04/17 面试题
ajax是什么及其工作原理
2012/02/08 面试题
Delphi软件工程师试题
2013/01/29 面试题
医生实习工作总结的自我评价
2013/09/27 职场文书
问卷调查计划书
2014/01/10 职场文书
财产保全担保书
2015/01/20 职场文书
公司租车协议书
2015/01/29 职场文书
置业顾问岗位职责
2015/02/09 职场文书
2015年酒店工作总结
2015/04/28 职场文书
民间借贷被告代理词
2015/05/23 职场文书
宝宝满月祝酒词
2015/08/10 职场文书
Python还能这么玩之只用30行代码从excel提取个人值班表
2021/06/05 Python
pytorch中的torch.nn.Conv2d()函数图文详解
2022/02/28 Python