浅谈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 获取HTML DOM节点元素的方法小结
Apr 24 Javascript
jQuery学习笔记之jQuery的动画
Dec 22 Javascript
jQuery中noconflict函数的实现原理分解
Feb 03 Javascript
js实现照片墙功能实例
Feb 05 Javascript
最精简的JavaScript实现鼠标拖动效果的方法
May 11 Javascript
Jquery和BigFileUpload实现大文件上传及进度条显示
Jun 27 Javascript
JS实现PC手机端和嵌入式滑动拼图验证码三种效果
Feb 15 Javascript
关于使用axios的一些心得技巧分享
Jul 02 Javascript
vux uploader 图片上传组件的安装使用方法
May 15 Javascript
抖音上用记事本编写爱心小程序教程
Apr 17 Javascript
详解Node.js一行命令上传本地文件到服务器
Apr 22 Javascript
使用Node.js实现base64和png文件相互转换的方法
Mar 11 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 数组使用详解 推荐
2011/06/02 PHP
php中使用session防止用户非法登录后台的方法
2015/01/27 PHP
thinkphp下MySQL数据库读写分离代码剖析
2017/04/18 PHP
yii2局部关闭(开启)csrf的验证的实例代码
2017/07/10 PHP
如何在Laravel5.8中正确地应用Repository设计模式
2019/11/26 PHP
如何实现动态删除javascript函数
2007/05/27 Javascript
兼容FireFox 的 js 日历 支持时间的获取
2009/03/04 Javascript
基于jQuery+HttpHandler实现图片裁剪效果代码(适用于论坛, SNS)
2011/09/02 Javascript
解析Jquery的LigerUI如何实现文件上传
2013/07/09 Javascript
一个JavaScript变量声明的知识点
2013/10/28 Javascript
JavaScript访问CSS属性的几种方式介绍
2014/07/21 Javascript
jQuery简单动画变换效果实例分析
2016/07/04 Javascript
AngularJS基础 ng-options 指令详解
2016/08/02 Javascript
BootStrap 导航条实例代码
2017/05/18 Javascript
jQuery实现节点的追加、替换、删除、复制功能示例
2017/07/11 jQuery
jquery实现限制textarea输入字数的方法
2017/09/06 jQuery
在Mac下彻底卸载node和npm的方法
2018/05/16 Javascript
纯JS实现可用于页码更换的飞页特效示例
2018/05/21 Javascript
解决vant title-active-color与title-inactive-color不生效问题
2020/11/03 Javascript
[04:00]黄浦江畔,再会英雄——完美世界DOTA2 TI9应援视频
2019/07/31 DOTA
Python中常见的异常总结
2018/02/20 Python
python反编译学习之字节码详解
2019/05/19 Python
解析python的局部变量和全局变量
2019/08/15 Python
python树的同构学习笔记
2019/09/14 Python
django ORM之values和annotate使用详解
2020/05/19 Python
茱莉蔻美国官网:Jurlique美国
2020/11/24 全球购物
Tessabit美国:集世界奢侈品和设计师品牌的意大利精品买手店
2020/06/29 全球购物
综合测评自我鉴定
2013/10/08 职场文书
车间班组长岗位职责
2013/11/13 职场文书
幼儿园大班毕业感言
2014/02/06 职场文书
教师评职称工作总结2015
2015/04/20 职场文书
导游词之白茶谷九龙峡
2019/10/23 职场文书
Nest.js参数校验和自定义返回数据格式详解
2021/03/29 Javascript
星际争霸:毕姥爷vs解冻01
2022/04/01 星际争霸
疑《守望先锋2》A测截图泄露 或将推出新模式、新界面
2022/04/03 其他游戏
Python 读取千万级数据自动写入 MySQL 数据库
2022/06/28 Python