对javascript变量提升跟函数提升的理解
在写javascript代码的时候,经常会碰到一些奇怪的问题,例如:
console.log(typeof hello);
var hello = 123;//变量
function hello(){//函数声明 }
console.log(typeof hello);
var hello = function(){//函数表达式
}
console.log(typeof hello);
//function number function
对于为什么会是这样的一个结果:function number function 很多人可能会抱着一种疑问的态度,为什么不是 undefined function function ?
在上面的代码中其实就涉及到了变量提升与函数提升这个概念,在javascript引擎中,对于javascript代码的解析并不是从上往下,逐行进行解析的,而是以代码块进行解析:
在相同作用域下,首先是将声明函数提升到代码的最顶端,其次就是变量提升,最后就是函数表达式,上述代码在javascript引擎中的解析就是可以看成如下:
function hello(){//函数声明
}
console.log(typeof hello);//function
var hello;
hello = 123;
console.log(typeof hello);//number
var hello;
hello = function(){}
console.log(typeof hello);//function
//function number function
var hello = 123;的解析是先对变量hello进行定义,var hello;然后再给变量赋值,这里的var hello 就是对变量的一个提升。如:
console.log(typeof hello);//undefined
var hello = 123;
console.log(typeof hello);//number //这里的变量hello被声明到作用域的顶端
常见的例子还有:
var hello = 123;
function test(){
console.log(hello);//undefined
var hello = 'haha';
console.log(hello);//haha
}
test();
console.log(hello);//123
//undefined haha 123
在test函数的作用域下,由于hello 变量被提升,所以第一个console.log(hello);打印的就是undefined,第二个console.log(hello);打印的就是haha
最终结果就是 undefined haha 123
对javascript变量提升跟函数提升的理解的更多相关文章
- JavaScript系列文章:变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- JavaScript:变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- 谈谈javascript中的变量提升还有函数提升
在很多面试题中,经常会看到关于变量提升,还有函数提升的题目,所以我就写一篇自己理解之后的随笔,方便之后的查阅和复习. 首先举个例子 foo();//undefined function foo(){ ...
- JavaScript: 变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- JS 变量提升与函数提升
JS 变量提升与函数提升 JS变量提升 变量提升是指:使用var声明变量时,JS会将变量提升到所处作用域的顶部.举个简单的例子: 示例1 console.log(foo); // undefined ...
- JS——变量提升和函数提升
一.引入 在了解这个知识点之前,我们先来看看下面的代码,控制台都会输出什么 var foo = 1; function bar() { if (!foo) { var foo = 10; } aler ...
- js中变量提升和函数提升
变量提升和函数提升的总结 我们在学习JavaScript时,会遇到变量提升和函数提升的问题,为了理清这个问题,现做总结如下,希望对初学者能有所帮助 我们都知道 var 声明的变量有变量提升,而 let ...
- ES6-LET,变量提升,函数提升
1:let命令 ①类似var,但只在let所在代码块内有效 ②不存在变量提升 ③暂时性死区(TDZ)—有let命令时,在此命令前都没法使用此变量 ④不允许重复声明 ⑤ES6允许块级作用域任意嵌套 ⑥E ...
- js变量提升与函数提升的详细过程
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
随机推荐
- POJ2217(最长公共子串)
Secretary Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 992 Accepted: 408 Descripti ...
- CSS3:CSS 听觉参考手册
ylbtech-CSS3:CSS 听觉参考手册 1.返回顶部 1. 听觉样式表 听觉样式表可把语音合成与音响效果相组合,使用户可以听到信息,而无需进行阅读. 听觉呈现可用于: 视觉能力低弱的人士 帮助 ...
- Code-NFine:.NET快速开发平台 NFine.Framework Web框架
ylbtech-Code-NFine:.NET快速开发平台 NFine.Framework Web框架 1.NFine.Framework 详细介绍返回顶部 1. NFine 是基于 C# 语言的极速 ...
- 重载和const形参的学习心得
在C++ primer 5th中,第6章的练习6.39(a)中,关于重载和const形参的学习心得. 练习6.39:说明在下面的每组声明中第二条声明语句是何含义.如果有非法的声明,请指出来. (a) ...
- Appleman and a Sheet of Paper
题意: 给一纸条,两种操作: 1.将左侧长度为$x$的纸条向右翻折. 2.询问位于$[l,r]$的纸条总长度. 解法: 考虑启发式,每一次一个小纸条折叠我们可以看做是一次合并,如果我们每一次将较小的纸 ...
- Coloring Brackets
题意: 给一匹配的括号序列,要求每对括号恰有一个被染成蓝或红色,要求相邻的括号不同色,求方案数. 解法: 类比树的hash将括号序列转化为一棵树,树上子节点之间不得出现冲突, 子节点和父节点不得出现冲 ...
- c++函数模板1
1 定义: 函数模板 只适用于参数个数相同但是类型不同 而且函数体相同的情况 2 这个例子没有使用模板的情况 #include <iostream> using namespace std ...
- c++中IO输入输出流总结<一>
1 io类图关系 1.1 简化形式 1.1.2补充 iostream: istream:从流中读取 ostream:写入到流 iosteram:读写流 fstream: ifstream:从文件读 o ...
- suse 11.4添加阿里源
感谢SilenMark 作者,让我找到了一个可用的suse 国内源. 大家直接使用root 用户执行以下命令,添加阿里源 zypper addrepo -f http://mirrors.aliyun ...
- idea ultmate版安装后toolWindows没有database
点击Configure--->plugins将database勾选