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. nginx -g "daemon off;" 你学废了吗?

    去年的时候写了一篇原创<前后端分离,如何在前端项目中动态插入后端API基地址?(in docker)>, 我自认为这篇生产实践是对大前端. 容器化.CI/CD的得意之作. 对于前后端分离的 ...

  2. Deepin20系统安装Nvidia驱动

    Deepin20系统安装Nvidia驱动 系统设备配置信息如下: 电脑型号:华硕天选air[ASUS-FX516P] 显卡型号:RTX 3070 移动版独显 处理器型号: 11th Gen Intel ...

  3. CS5211替代PS8625|设计DP转LVDS转接板|替代PS8625方案

    1.CS5211与PS8625功能概述 CS5211是一个eDP到LVDS转换器,配置灵活,适用于低成本显示系统.CS5211与eDP 1.2兼容,支持1通道和2通道模式,每通道速度为1.62Gbps ...

  4. vue中使用JSX报错,如何解决

    Support for the experimental syntax 'jsx' isn't currently enabled (32:12): 30 | }, 31 | render() { & ...

  5. C# .net 环境下使用rabbitmq消息队列

    消息队列的地位越来越重要,几乎是面试的必问问题了,不会使用几种消息队列都显得尴尬,正好本文使用C#来带你认识rabbitmq消息队列 首先,我们要安装rabbitmq,当然,如果有现成的,也可以使用, ...

  6. [学习笔记] RabbitMQ的安装使用

    安装 使用命令行安装,会自动管理依赖(推荐): choco install rabbitmq 安装包安装: 以管理员身份安装64位的 Erlang. 下载并安装 RabbitMQ 服务.下载地址. R ...

  7. HiSql 实现case语法操作 新一代无实体ORM框架

    HiSql 实现case语法操作 在SqlServer,Oralce,Hana,PostGreSql,MySql 这些数据都支持SQL case语法,平常在实现业务开发中也会常用到,那么HiSql对于 ...

  8. ElasticSearch、Kibana 介绍&安装

    目录 ElasticSearch 介绍 基于数据库查询的问题 倒排(反向)索引 ES 存储和查询的原理 ES 核心概念 ES 安装 Kibana ElasticSearch 介绍 基于数据库查询的问题 ...

  9. python 设计模式:单例模型

    一.单例模型简介 代码的设计模式共有25种,不同的应用场景应用不同的设计模式,从而达到简化代码.利于扩展.提高性能等目的.本文简述Python实现的单例模式场景.简而言之,单例模式的应用场景是一个类对 ...

  10. Centos7 安装LAMP以及nextcloud

    第一步:安装apache 在centos中 apache叫httpd yum update #更新源 yum install httpd #安装apache systemctl stop firewa ...