今天公司一个实习小妹子问我两段JS代码的区别:

<script type="text/javascript">

var a = "Hello";

function test(){

var a;

alert(a);

a = "World";

alert(a);

}

</script>

  1. <script type="text/javascript">
  2. var a = "Hello";
  3. function test(){
  4. alert(a);
  5. a = "World";
  6. alert(a);
  7. }
  8. </script>

我想,好简单呀,不就是全局变量跟局部变量的scope问题吗?我说:"当全局变量跟局部变量重名时,局部变量的scope会覆盖掉全局变量的scope,当离开局部变量的scope后,又重回到全局变量的scope。所以两段代码运行的结果分别为:1) undefined World 2) Hello World。然后我随意编了如下一个例子给她:

<script>

  1. var a =1;
  2. function test(){
  3. alert(a);
  4. var a = 2;
  5. alert(a);
  6. }
  7. test();
  8. alert(a);
  9. </script>

大家猜结果等于多少?是输出1 2 1 吗?嗯嗯,当我把测试case发给她之前也是这么认为的,但测试输出后……运行结果是 undefined 2 1。当时百思不得其解,问了谷老师才知道,我对JS还不是非常了解,所以痛下苦功,学习+测试,总结如下:

一、Javascript的变量的scope是根据方法块来划分的(也就是说以function的一对大括号{ }来划分)。切记,是function块,而for、while、if块并不是作用域的划分标准,可以看看以下几个例子:

  1. <script>
  2. function test2(){
  3. alert ("before for scope:"+i);    // i未赋值(并不是未声明!使用未声明的变量或函数全抛出致命错误而中断脚本执行)
  4. // 此时i的值是underfined
  5. for(var i=0;i<3;i++){
  6. alert("in for scope:"+i);  // i的值是 0、1、2, 当i为3时跳出循环
  7. }
  8. alert("after for scope:"+i);  // i的值是3,注意,此时已经在for scope以外,但i的值仍然保留为3
  9. while(true){
  10. var j = 1;
  11. break;
  12. }
  13. alert(j);    // j的值是1,注意,此时已经在while scope以外,但j的值仍然保留为1
  14. if(true){
  15. var k = 1;
  16. }
  17. alert(k);  //k的值是1,注意,此时已经在if scope以外,但k的值仍然保留为1
  18. }
  19. test2();
  20. //若在此时(function scope之外)再输出只存在于test2 这个function scope里的 i、j、k变量会发生神马效果呢?
  21. alert(i); //error! 没错,是error,原因是变量i未声明(并不是未赋值,区分test2函数的第一行输出),导致脚本错误,程序到此结束!
  22. alert("这行打印还会输出吗?"); //未执行
  23. alert(j); //未执行
  24. alert(k); //未执行
  25. </script>

二、Javascript在执行前会对整个脚本文件的声明部分做完整分析(包括局部变量),从而确定实变量的作用域。怎么理解呢?看下面一个例子:

  1. <script>
  2. var a =1;
  3. function test(){
  4. alert(a); //a为undefined! 这个a并不是全局变量,这是因为在function scope里已经声明了(函数体倒数第4行)一个重名的局部变量,
  5. //所以全局变量a被覆盖了,这说明了Javascript在执行前会对整个脚本文件的定义部分做完整分析,所以在函数test()执行前,
  6. //函数体中的变量a就被指向内部的局部变量.而不是指向外部的全局变量. 但这时a只有声明,还没赋值,所以输出undefined。
  7. a=4
  8. alert(a);  //a为4,没悬念了吧? 这里的a还是局部变量哦!
  9. var a;     //局部变量a在这行声明
  10. alert(a);  //a还是为4,这是因为之前已把4赋给a了
  11. }
  12. test();
  13. alert(a); //a为1,这里并不在function scope内,a的值为全局变量的值
  14. </script>

三,当全局变量跟局部变量重名时,局部变量的scope会覆盖掉全局变量的scope,当离开局部变量的scope后,又重回到全局变量的scope,而当全局变量遇上局部变量时,怎样使用全局变量呢?用window.globalVariableName。

  1. <script>
  2. var a =1;
  3. function test(){
  4. alert(window.a);  //a为1,这里的a是全局变量哦!
  5. var a=2;     //局部变量a在这行定义
  6. alert(a);  //a为2,这里的a是局部变量哦!
  7. }
  8. test();
  9. alert(a); //a为1,这里并不在function scope内,a的值为全局变量的值
  10. </script>
 

js--局部变量的更多相关文章

  1. js局部变量与全局变量

    在最外层定义的是全局变量 如果在函数内部不用var声明直接赋值的变量,那么这个变量也是全局变量 在函数内部用var声明的变量叫做局部变量 定义在最开头的全局变量在整个js范围内都可以访问到,都可以使用 ...

  2. js局部变量,参数

    作者:zccst 所有函数的参数都是按值传递的.也就是说,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样.基本类型值的传递如同基本类型变量的赋值一样.而引用类型值的传递,则 ...

  3. Cocos2d-JS/Ajax用Protobuf与NodeJS/Java通信

    原文地址:http://www.iclojure.com/blog/articles/2016/04/29/cocos2d-js-ajax-protobuf-nodejs-java Google的Pr ...

  4. 静态Web开发 JavaScript

    三章 Javascript 1节javascript基本语法和注意事项 脚本,一条条的文字命令.执行时由系统的一个解释器,将其一条条的翻译成机器可识别的指令,然后执行.(不需要编译)常见的脚本:批处理 ...

  5. 前端之DOM操作

    一.概念 javascript javascript是一种脚本语言,可以被浏览器解析,所以它可以称之为前端的三把利器之一. javascript跟java没有半毛钱关系. 声明局部变量:使用关键字va ...

  6. 全栈开发工程师微信小程序-下

    app.json { "pages": ["pages/index/index"] } index.wxml <text>Hello World&l ...

  7. Emscripten教程之代码可移植性与限制(一)

    Emscripten教程之代码可移植性与限制(一) 翻译:云荒杯倾本文是Emscripten-WebAssembly专栏系列文章之一,更多文章请查看专栏.也可以去作者的博客阅读文章.欢迎加入Wasm和 ...

  8. 针对JS经典题型对全局变量及局部变量的理解浅谈

    第一次写博,还蛮激动... 看到了三题经典题型,就我目前的认识对此题进行总结.如有错误,敬请指正 首先,我们先明确一下JS引擎的工作步骤: js引擎工作分为两步: 1.将这个js中的变量和函数声明保存 ...

  9. js方法入参或局部变量和全局变量重名,用来赋值全局变量会失败

    今天遇到个bug,最后终于知道原因了,js方法入参和全局变量重名,用入参赋值全局变量失败,就是说方法入参不能和全局变量重名. 现在下面的例子也说明,局部变量和全局变量不可以同名不光是入参,只要同名赋值 ...

  10. JS函数 -- 功能,语法,返回值,匿名函数,自调用匿名函数,全局变量与局部变量,arguments的使用

    “JavaScript设计得最出色的就是它的函数的实现.” -- <JavaScript语言精粹> 函数包含一组语句,它们是JS的基础模块单元,用于指定对象的行为.一般来说,所谓编程,就是 ...

随机推荐

  1. Unity3D 浏览工具

    键盘控制: 1.键盘箭头:先选中场景激活场景 按箭头前后左右  shift +箭头 加速移动 2.使物体成为场景焦点:左侧层次视图列表选中物体,移动鼠标指针到场景视图上 按F,选中物体成为场景视图中心 ...

  2. CodeForces 645C Enduring Exodus

    枚举,三分. 首先,这$n+1$个人一定是连续的放在一起的.可以枚举每一个起点$L$,然后就是在$[L,R]$中找到一个位置$p$,使得$p4最优,因为越往两边靠,距离就越大,在中间某位置取到最优解, ...

  3. Oracle怎么更改用户名和密码

    通过修改ORACLE基表的方式来修改用户名直接修改底层表USER$更改用户名(该方法在Oracle9i,Oracle10g中测试通过)SQL> UPDATE USER$ SET NAME='TT ...

  4. C语言:XML学习

    说明:文章中代码是我参考别人的例子得来的. XML基础 一.XML的概念 Xml是一种可扩展标记语言.在电子计算机中,标记指计算机所能理解的信息符号,通过此种标记,计算机之间可以处理包含各种的信息比如 ...

  5. java系统参数

    package com.test; import java.sql.SQLException; import java.util.Properties; import com.mchange.v2.c ...

  6. sql语句实现隐藏手机号码中间四位的方法

    1、select REPLACE(mobile,SUBSTR(mobile,4,4), '****') as mobile from tableName 2、select INSERT(mobile, ...

  7. [转]numpy性能优化

    转自:http://blog.csdn.net/pipisorry/article/details/39087583 http://blog.csdn.net/pipisorry/article/de ...

  8. svn用Cornerstone上传项目丢失静态库.a问题的解决

    最近电脑重装系统后,装上Cornerstone上传项目后,发现又有丢失.a文件的问题,这里说一下解决办法,打开Preferences-->Subversion-->General,将Use ...

  9. schemes-universalLink-share_IOS-android-WeChat-chunleiDemo

    schemes-universalLink-share_IOS-android-WeChat-chunleiDemo The mobile terminal share page start APP ...

  10. CSU 1811 Tree Intersection

    莫队算法,$dfs$序. 题目要求计算将每一条边删除之后分成的两棵树的颜色的交集中元素个数. 例如删除$u->v$,我们只需知道以$v$为$root$的子树中有多少种不同的颜色(记为$qq$), ...