JavaScript的那些坑之变量提升
想总结一下JS的变量提升特性,都是由于一道题。先上题。
var name = 'World!';
(function () {
if (typeof name === 'undefined') {
var name = 'Jack';
console.log('Goodbye ' + name);
}else{
console.log('Hello ' + name);
}
})();
这是JavaScript专业八级測试。你能做对几道?上的一道题。
假设不知道JS的变量提升的话。绝对会以为world的name是全局变量,能够訪问到name,然后运行else里的语句。要是这么觉得就大错特错了。
function能够訪问到name=World!这个全局变量这没错。可是function内部又定义了一个局部变量name,并且是用var定义,这样就截然不同了。那我们来做个实验。
是否在函数内部定义Jack。对整个程序发生了质的变化。
那么我们以下就来分析一下为什么会有这种变化。
变量定义是存在作用域的,这里就不做累述。详细的能够到Javascript的变量和作用域问题(二)之作用域里查看。
我们最基本的是了解下变量声明之后是怎么被解释器解释的,
function foo() {
//something
var x = 1;
}
这个样例实际上和以下的样例是同样的。
function foo() {
var x;
//something
x = 1;
}
也就是说。变量声明总是会被解释器悄悄地被“提升”到方法体的最顶部。
要是这样讲没有说服力的话。再来用console.log试一下就好。
function foo() {
console.log(x); //undefined
var x = 1;
}
foo();
非常明显,在var之前是訪问不到x的。由于var仅仅是定义了x,在console的时候并没有赋值,所以当然是undefined了。
再回到最原先的题上,由于在匿名函数里又又一次定义了一遍name。所以name的var被悄悄的提到了函数的最前面。
也变成了这样。
var name = 'World!';
(function () {
var name; //变量提升了。 if (typeof name === 'undefined') {
name = 'Jack';
console.log('Goodbye ' + name);
}else{
console.log('Hello ' + name);
}
})();
name就变成了undefined,当然进入了if而不是进入else,自然而然也就打印出了Goodbye,Jack。
一点补充。假设对于全局作用于范围的变量,var与不var是有差别的.
没有var的写法。其变量不会被提升。
比方以下两个程序。第二个会报错:
alert(a);
var a=1; alert(a);
a=1;
总之。变量提示就是var在函数内部使用的时候,在var定义变量的语句之前是訪问不到变量的!
JavaScript的那些坑之变量提升的更多相关文章
- 关于JavaScript的词法作用域及变量提升的个人理解
关于JavaScript的作用域,最近听到一个名词:“词法作用域”:以前没有听说过(读书少),记录一下对此的理解,加深印象. 词法作用域:在JavaScript中,一个函数的作用域,在这个函数定义好的 ...
- js 面试的坑:变量提升
全局中的解析和执行过程 预处理:创建一个词法环境(LexicalEnvironment,在后面简写为LE),扫描JS中的用声明的方式声明的函数,用var定义的变量并将它们加到预处理阶段的词法环境中去. ...
- javascript中的作用域和变量提升
js的运行主要分两个阶段:js的预解析和运行,预解析阶段所有的变量声明和函数定义都会提前,但是变量的赋值不会提前.
- 《浏览器工作原理与实践》<07>变量提升:JavaScript代码是按顺序执行的吗?
讲解完宏观视角下的浏览器后,从这篇文章开始,我们就进入下一个新的模块了,这里我会对 JavaScript 执行原理做深入介绍. 今天在该模块的第一篇文章,我们主要讲解执行上下文相关的内容.那为什么先讲 ...
- js中变量提升和函数提升
变量提升和函数提升的总结 我们在学习JavaScript时,会遇到变量提升和函数提升的问题,为了理清这个问题,现做总结如下,希望对初学者能有所帮助 我们都知道 var 声明的变量有变量提升,而 let ...
- javascript中变量提升的理解
网上找了两个经典的例子 var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); // 10 var ...
- javascript中的变量作用域以及变量提升
在javascript中, 理解变量的作用域以及变量提升是非常有必要的.这个看起来是否很简单,但其实并不是你想的那样,还要一些重要的细节你需要理解. 变量作用域 “一个变量的作用域表示这个变量存在的上 ...
- JavaScript系列文章:变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- 关于JS变量提升的一些坑
function log(str) { // 本篇文章所有的打印都将调用此方法 console.log(str); } 函数声明和变量声明总是会被解释器悄悄地被“提升”到方法体的最顶部 变量声明.命名 ...
随机推荐
- git如何解决冲突(master分支的上的冲突--太岁头上动土)
欢迎加入前端交流群交流知识&&获取视频资料:749539640 git是什么就不废话了,详情点击 出现以下情况怎么解决? 有个index.ts文件 export const ENV = ...
- 认识React框架
在大厂面试的时候被问会不会React框架几乎是必须的,可见React框架在现在前端市场的份额.所以说学习React框架的必要性. react框架起源于Facebook的内部项目,因为对市场上的Java ...
- Linux 定时任务 Crontab按秒执行
目前在crontab中最小执行时间单位为分钟. 如果需要按秒来执行,有以下两种方法: 方法一:通过sleep来实现 例: 1.创建test.php文件,这里测试通过打印时间好区分. <?php ...
- maven 打包jar && lib
一.springboot 打包成jar 1.pom.xml <build> <!-- jar的名称--> <finalName>shiro</finalNam ...
- WPF MVVM 关闭窗体
由于程序采用MVVM模式同时有些操作需要单独窗口来进行处理.因此就会产生窗口关闭问题, 由于是MVVM和需要操作弹出窗口中操作的内容因此就需要在mvvm进行统一处理. 网上查了几种方法采用其中一种 不 ...
- C#调用SMS短信接口,轻松搞定发送短信的任务。。。。
首先我们需要去这里http://sms.webchinese.cn/申请一个账号和短信接口秘钥,在该网址下有许多语言的demo介绍,下面我主要为大家贴一个C#中的Helper类: using Syst ...
- poj 2955 Brackets 【 区间dp 】
话说这题自己折腾好久还是没有推出转移的公式来啊------------------ 只想出了dp[i][j]表示i到j的最大括号匹配的数目--ค(TㅅT)------------------- 后来搜 ...
- Kafka学习笔记(6)----Kafka使用Producer发送消息
1. Kafka的Producer 不论将kafka作为什么样的用途,都少不了的向Broker发送数据或接受数据,Producer就是用于向Kafka发送数据.如下: 2. 添加依赖 pom.xml文 ...
- TF从文件中读取数据
从文件中读取数据 在TensorFlow中进行模型训练时,在官网给出的三种读取方式,中最好的文件读取方式就是将利用队列进行文件读取,而且步骤有两步: 把样本数据写入TFRecords二进制文件 从队列 ...
- hibernate详细配置
映射配置 <!-- 映射文件: 映射一个实体类对象: 描述一个对象最终实现可以直接保存对象数据到数据库中. --> <!-- package: 要映射的对象所在的包(可选,如果不 ...