JavaScript变量提升及作用域
今天在知乎看前端面试题的时候,看到这样的问题,发现自己懂的真的是太少了,看了给的例子,所以写一下自己的理解。
首先放一段代码:
var v= “hello JavaScript”;
alert(v);
很明显,这样的是会弹出对话框;
将alert(v)写到一个函数中:
var v= “hello JavaScript”;
function test(){
alert(v);
};
test();
这样弹出的结果肯定也是和第一个一样;那么下面这种方式输出的结果是什么?
var bar=1;
function test(){
console.log(bar);
var bar=2;
console.log(bar);
}
test();
第一个console会打印undefined,第二个打印2;

这就涉及到了变量提升,同时也涉及了JavaScript的作用域的问题,JavaScript中浏览器解析变量的时候,会先在test()函数中进行变量的解析,console.log(bar);输出时浏览器在test()函数中寻找变量bar,但是因为在它的后面才定义了bar变量,,所以变量提升,浏览器把定义的变量放到了前面,但是为什么不应该是2呢?
再看下面的代码:
function(){
var a='one';
var b='two';
}
这个函数中用了这种定义变量并同时赋值的方式,其实相当于:
function(){
var a,b;
a='one';
b='two';
}
这也就是为什么输出的不是2了,var bar = 2;就相当于先定义了var bar;之后又给bar=2,但是bar的变量提升所以在执行console.log(bar);的时候会是undefined;后面的那个输出就不说了,很明显是正常输出2;
这也是涉及了作用域的问题,浏览器寻找变量是层层向上寻找,像下面这个例子:
var t=4;
function test(){
var Oitem=12;
funciton bar(){
var Titem=34;
console.log(t+" "+Oitem+" "+Titem);
}
}
输出的时候,bar()函数中对t变量进行寻找,首先在bar函数的作用域中进行查找,但是在bar函数中没有定义t变量,所以又会进行上一层的函数中查找,即对test()函数中进行查找,但是依然没有找到,所以会继续进行再上一层的查找,在window的作用域中找到了。
JavaScript变量提升及作用域的更多相关文章
- 回归基础: JavaScript 变量提升
from me: javascript的变量声明具有hoisting机制,它是JavaScript一个基础的知识点,也是一个比较容易犯错的点,平时在开发中,大大小小的项目都会遇到. 它是JavaScr ...
- javascript变量声明及作用域总结
javascript变量声明及作用域总结 一.总结 一句话总结:还是得好好看书,光看视频是不得行的,浅学无用,要相互印证,要真正理解才有用,比如<Javascript权威指南> 书 1.j ...
- JavaScript变量提升和函数声明预解析
1.首先理解函数作用域 在JavaScript中,变量的定义并不是以代码块作为作用域的,而是以函数作用作用域的.也就是说,如果变量是在某个函数中定义的,那么它在函数以外的地方是不可见的.而如果该变量是 ...
- js javascript变量提升
var:变量提升(无论声明在何处,都会被提至其所在作用域的顶部) let:无变量提升(所在的块内,未到let声明时(即let声明之前),是无法访问该变量的(not defined)),let变量不能重 ...
- JavaScript变量提升 面试题
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- javascript变量类型及作用域
javascript变量类型及作用域 一.简介 变量类型 ECMAScript变量可能包含两种不同类型的数据值:基本类型和引用类型. 基本类型 基本类型指的是简单的数据段,5种基本数据类型:undef ...
- 关于JavaScript变量提升的理解
废话不说,直接上代码(这是在JavaScript面对对象编程指南上面看到的一个例子) var a=123; function f(){ alert(a); var a=1; alert(a); } f ...
- javascript变量声明 及作用域
javascript变量声明提升(hoisting) http://openwares.net/js/javascript_declaration_hoisting.html 可能要FQ一下 java ...
- 【转】javascript变量声明 及作用域
javascript变量声明提升(hoisting) javascript的变量声明具有hoisting机制,JavaScript引擎在执行的时候,会把所有变量的声明都提升到当前作用域的最前面. 先看 ...
随机推荐
- web前端学习总结--CSS
CSS 什么是CSS? CSS 指层叠样式表(Cascading Style Sheets) 样式定义如何显示HTML元素 样式通常存储在样式表中 如何使用CSS 内联方式 样式定义在单个的HTML元 ...
- Python基础-判断闰年
输入一个年份,判断该年份是否是闰年并输出结果.求它是否是闰年?要求:能被4整除不能被100整除或者能被400整除. y=input('请输入年份:') if(y%4==0 and y%100 != 0 ...
- 【codeforces 510B】Fox And Two Dots
[题目链接]:http://codeforces.com/contest/510/problem/B [题意] 让你在一个二维的方格里面找环; 两个点有相邻的边它们才是相连的; 有环YES,没环NO ...
- 一个神奇的PHP框架:Phalcon 之编译安装
前言 CentOS7下升级PHP到最新版本以及编译安装phalcon框架,看相关文档无数遍,自己尝试编译安装之后才理解的更深,编译步骤以及碰到的问题做个简单的记录 php-7.0.11编译安装 1.下 ...
- android程序在调试时出现了套接字异常“java.net.SocketException: Permission denied”该如何解决
Socket不能对外连接,错误不会被报出,调试的时候,能看到Exception, 一般是抛出 java.net.socketexception permission denied这个异常.只要你的程序 ...
- AngularJS:一行JS代码实现控件验证效果
如上图所示,我们需要实现如下这些验证功能: 控件都是必输控件 都需要控制最大长度 第一次打开页面,控件不能显示为错误状态 输入内容再清空后,必输控件需要显示为错误状态 只有所有输入合法后,发布按钮才能 ...
- [学习笔记—Objective-C]《Objective-C-基础教程 第2版》第二章~第七章
在看完<Objective-C 程序设计 第6版>之后,看了一些关于iOS开发职位的面试题,发现自身基础非常是不牢,于是打算以查缺补漏的方式阅读还有一本关于Objective-C的基础书籍 ...
- 【转】shell中的内建命令, 函数和外部命令
原文:http://www.cnblogs.com/xkfz007/archive/2011/10/13/2209571.html linux命令有内部命令和外部命令之分.内部命令实际上是shell程 ...
- iOS中的多线程NSThread/GCD/NSOperation & NSOperationQueue
iOS多线程有四套多线程方案: Pthreads NSThread GCD NSOperation & NSOperationQueue 接下来我来一个一个介绍他们 Pthreads 在类Un ...
- Apache日志优化
apache执行时会记录其处理的全部请求的相关信息.同一时候,也会记录在处理过程中发生异常状况的相关信息. server能够用多种格式将与请求相关的活动信息记录在多个日志文件里,只是却仅仅能记录一份错 ...