2
3
4
5
6
7
8
9
10
<script type="text/javascript">
var a = 1;
function hehe()
{
         window.alert(a);
         var a = 2;
         window.alert(a);
}
hehe();
</script>

  

执行结果如下所示:

第一个alert:

第二个alert:

这是一个令人诧异的结果,为什么第一个弹出框显示的是undefined,而不是1呢?

一个页面里直接定义在script标签下的变量是全局变量即属于window对象的变量,按照javascript作用域链的原理,当一个变量在当前作用域下找不到该变量的定义,那么javascript引擎就会沿着作用域链往上找直到在全局作用域里查找。

首先这段程序涉及到了以下三个概念 执行环境、变量对象、 作用域链、 js的执行环境分全局的(浏览器的话就是window执行环境)和function执行环境,变量对象是用来保存执行环境下的变量和方法的,而作用域链上放着一个一个的变量对象形成一个链条。 这段代码的执行过程应该是这样的 首先进入全局执行环境 建立该执行环境下的变量对象A(保存有该执行环境下的x和一个匿名方法),再往下执行到匿名方法的执行环境 建立变量对象B(保存有该执行环境下的x),而js的当前执行环境的变量对象永远放在作用域链的最前端,所在执行第一个alert(x), 就会找当前执行环境的变量对象B是否保存有x, 而事实上是有的,但alert(x)之前没有给x赋值,所出得到的结果就是undefined, 如果变量对象B中不存在x,那么程序就会顺着作用域链找上一个变量对象A里是否有x.

js的变量有两种作用域:全局变量和局部变量。没有使用 var 声明的变量和在function之外声明的变量都是全局变量,是window属性之一;使用 var 声明的变量属于所在函数,不管在函数的哪个位置出现,等价于在函数一开始声明。局部变量比同名全局变量的优先级高,所以局部变量会隐藏同名的全局变量。要想访问被隐藏的全局变量就加上 window. 前缀。
js没有块作用域,在语句块之后,在函数结束之前,语句块定义的变量都是可以访问的。比如:for(var idx =0; idx<2;idx++){} alert(idx); 结果显示为2。

上段代码相当于

1
2
3
4
5
6
7
var x=1;
function (){
var x;
alert(x);
 x=1212;
alert(x);
}

正确代码:第一次要this.x

1
2
3
 
 
 
 
 
 
 
4
5
6
7
8
9
10
<script type="text/javascript">
var a = 1;
function hehe()
{
         window.alert(this.a);
         var a = 2;
         window.alert(a);
}
hehe();
</script>

js中全局和局部变量的区别的更多相关文章

  1. iOS中 static变量与全局、局部变量的区别 !

    static变量与全局.局部变量的区别 全局变量(外部变量)的说明之前再冠以static 就构成了静态的全局变量.全局变量本身就是静态存储方式,静态全局变量当然也是静态存储方式. 这两者在存储方式上并 ...

  2. PHP和JS中全局变量和局部变量

    一,PHP中全局变量和局部变量 php与C++中对全局变量和局部变量定义类似,全局变量:函数外定义的变量,在全局通用:局部变量:在函数内定义的变量,只在函数内有效.PHP中变量范围跨越了include ...

  3. js中全局变量和局部变量以及变量声明提升

    javascript中全局变量和局部变量的区别 转载前端小99 发布于2018-04-23 15:31:35 阅读数 2102  收藏 展开 [javascript] view plain copy ...

  4. java之static变量与全局、局部变量的区别

    static变量与全局.局部变量的区别 全局变量(外部变量)的说明之前再冠以static 就构成了静态的全局变量.全局变量本身就是静态存储方式,静态全局变量当然也是静态存储方式.这两者在存储方式上并无 ...

  5. 浅谈JS中的!=、== 、!==、===的用法和区别 JS中Null与Undefined的区别 读取XML文件 获取路径的方式 C#中Cookie,Session,Application的用法与区别? c#反射 抽象工厂

    浅谈JS中的!=.== .!==.===的用法和区别   var num = 1;     var str = '1';     var test = 1;     test == num  //tr ...

  6. JS中isPrototypeOf 和hasOwnProperty 的区别 ------- js使用in和hasOwnProperty获取对象属性的区别

    JS中isPrototypeOf 和hasOwnProperty 的区别 1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的 ...

  7. (网页)Angular.js 中 copy 赋值与 = 赋值 区别

    转自st.gg Angular.js 中 copy 赋值与 = 赋值 区别 为什么用 $scope.user = $scope.master; $scope.master 会跟着 $scope.use ...

  8. js中的substr和substring区别

    js中的substr和substring区别 Substring: 该方法可以有一个参数也可以有两个参数. (1)  一个参数: 示例: var str=“Olive”: str.substring( ...

  9. JS 中的require 和 import 区别整理

    ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使 ...

随机推荐

  1. elementUI表单嵌套表格并对每行进行校验

    elementUI表单嵌套表格并对每行进行校验 elementUI 表单嵌套表格并进行校验. 目录 效果展示 代码链接 关键代码 完整代码 效果展示 先看看这是不是需要的效果^_^ ​ 如图,Elem ...

  2. CS5218替代AG6310方案|设计DP转HDMI转换方案|替代AG6310方案

    AG6310是一款实现显示端DP口转HDMI数据转换器.AG6310是一款单芯片解决方案,通过DP端口连接器传输视频和音频流,其DP1.2支持可配置的1.2和4通道,分别为1.62Gbps.2.7Gb ...

  3. 啥是Gossip协议?

    你好呀,我是歪歪. 元旦的时候我看到一个特别离谱的谣言啊,具体是什么内容我就不说了,我怕脏了大家的眼睛. 但是,我看到一个群里传的那叫一个绘声绘色,大家讨论的风生水起的,仿佛大家就在现场似的. 这事吧 ...

  4. windows环境下node安装教程(超详细)

    安装node.js 1.下载node: 下载地址:http://nodejs.cn/download/ node.js的zip包安装时是直接解压缩后就可以了, node.js的msi包是傻瓜式一路ne ...

  5. Windows下安装配置ant

    1.ant安装 请从官网下载ant的*.zip格式的安装包, Windows建议下载*.zip版本, Linux建议下载*.gz版本. 2.配置环境变量 解压之后,在Windows中配置环境变量, 在 ...

  6. 新装CentOS7用yum安装软件提示 cannot find a valid baseurl for repobase7x86_64

    1.打开网络配置文件:vi /etc/sysconfig/network-scripts/ifcfg-ens33(每个机子都可能不一样,但格式会是"ifcfg-e..."). 2. ...

  7. JSch Algorithm negotiation fail

    https://stackoverflow.com/questions/30846076/jsch-algorithm-negotiation-fail As you can see, the ser ...

  8. asyncio异步编程

    1. 协程 协程不是计算机提供,程序员认为创造 协程(Coroutine),也可以被称为微线程,是一种用户态内的上下文切换技术,其实就是一个线程实现代码块相互切换执行.例如: def func1(): ...

  9. JSP页面实际上就是Servlet

    注:图片如果损坏,点击文章链接:https://www.toutiao.com/i6513069824690618883/ 前面一直提到了Servlet的内容,也是我们平时理解的后台,这次说一下前台的 ...

  10. 《剑指offer》面试题07. 重建二叉树

    问题描述 输入某二叉树的前序遍历和中序遍历的结果,请重建该二叉树.假设输入的前序遍历和中序遍历的结果中都不含重复的数字. 例如,给出 前序遍历 preorder = [3,9,20,15,7] 中序遍 ...