关于JS中变量提升的规则和原理的一点理解(二)
上篇文章中讲到变量提升和函数提升的先后顺序时蒙了,后来去查了一下资料,特别整理一下。
在《你不知道的JavaScript(上卷)》一书的第40页中写到:函数会首先被提升,然后才是变量。
书中的一个代码示例是:
foo(); //1
var foo;
function foo() {
console.log(1);
}
foo = function() {
console.log(2);
}
这个例子相对比较好理解,就是foo这个函数会先被声明再作用域的开始部分,实际上这个代码片段会被引擎理解为如下形式:
function foo() {
console.log(1);
}
foo(); //1
foo = function() {
console.log(2);
}
可是,当在网上看到这个一个例子时一开始我也是对运行结果不太理解的:
console.log(foo); // function foo(){...}
function foo(){
console.log("函数声明");
}
var foo = "变量";
咋一看这段代码输出的应该是undefined啊,因为根据规则是先提升函数,然后才是变量,所以不应该是这样吗?
function foo(){
console.log("函数声明");
}
var foo = undefined;
这个理解最大的一个误区在于变量提升时只是声明了变量,并没有赋值,也就是
var foo;
仅此而已!我们平时在这种声明之前打印变量之所以是undefined是因为只是声明了,其他地方并没有赋值,所以是undefined,像这样的:
console.log(wanc); //undefined
var wanc = '66';
可是在上面的例子中,变量和函数都是存在的,而且是先提升的函数foo,然后是声明变量var foo;声明变量的过程中并没有改变变量的值,所以最上面打印的还是函数foo;
由此一个小问题引出的思考:有问题就要多查资料,包括网上的和书上的,对比不同人的理解,最终的目的就是要做到知其然并且知其所以然,加油!
参考资料:
- http://bbs.csdn.net/topics/392018835
- 《你不知道的JavaScript(上)》
关于JS中变量提升的规则和原理的一点理解(二)的更多相关文章
- 关于JS中变量提升的规则和原理的一点理解
关于变量提升,以前在一些教程和书籍上都听到过,平时开发中也知道有这个规律,但是今天突然在一个公开课中听到时,第一反应时一脸懵逼,然后一百度,瞬间觉得好熟悉啊,差点被这个概念给唬住了,不信我给你 ...
- js中变量提升(一个是变量,一个是函数表达式都会存在变量提升,函数声明不存在)
一.变量提升 在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域.变量提升即将变量声明提升到它所在作用域的最开始的部分.上个简历的例子如: ...
- js中变量提升和函数提升
变量提升和函数提升的总结 我们在学习JavaScript时,会遇到变量提升和函数提升的问题,为了理清这个问题,现做总结如下,希望对初学者能有所帮助 我们都知道 var 声明的变量有变量提升,而 let ...
- 深入理解js的变量提升和函数提升
一.变量提升 在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域.变量提升即将变量声明提升到它所在作用域的最开始的部分.上个简历的例子如: ...
- JavaScript中变量提升是语言设计缺陷
首先纠正下,文章标题里的 “变量提升” 名词是随大流叫法,“变量提升” 改为 “标识符提升” 更准确.因为变量一般指使用 var 声明的标识符,JS 里使用 function 声明的标识符也存在提升( ...
- 深入理解js的变量提升和函数提升(转)
一.变量提升 在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域.变量提升即将变量声明提升到它所在作用域的最开始的部分.上个简历的例子如: ...
- js中变量的声明
大家都知道js中变量的声明是要提前的,下面有4个样例: 1.if(!"t" in window){ var t = 1; } alert(t);答案是undefine ...
- php面试专题---1、php中变量存储及引用的原理
php面试专题---1.php中变量存储及引用的原理 一.总结 一句话总结: 查看变量的存储结构可以安装xdebug扩展,用xdebug_debug_zval()方法,不推荐使用memory_get_ ...
- js中call和apply的实现原理
js中call和apply的实现原理 实现call的思路: /* 还有就是call方法是放在Function().prototype上的也就是构造函数才有的call方法 (我门可 ...
随机推荐
- vue双向绑定的原理及实现双向绑定MVVM源码分析
vue双向绑定的原理及实现双向绑定MVVM源码分析 双向数据绑定的原理是:可以将对象的属性绑定到UI,具体的说,我们有一个对象,该对象有一个name属性,当我们给这个对象name属性赋新值的时候,新值 ...
- java并发编程的艺术——第五章总结(Lock锁与队列同步器)
Lock锁 锁是用来控制多个线程访问共享资源的方式. 一般来说一个锁可以防止多个线程同时访问共享资源(但有些锁可以允许多个线程访问共享资源,如读写锁). 在Lock接口出现前,java使用synchr ...
- VR、AR、MR定义区别
近日, 获得谷歌5亿美元融资的技术公司Magic Leap在WSJD展会中放出了一段实录视频,引起不小骚动.如今,也有媒体称他们为MR公司,那么VR.AR.MR之间到底有什么区别呢. VR.AR.MR ...
- ABP 找不到版本为 (>= 1.0.0-preview1-27891) 的包 Microsoft.AspNetCore.SignalR 错误
错误描述: 下载ABP模板项目3.4.1的版本(当前最新版本),编译加载nuget包Microsoft.AspNetCore.SignalR时会报如下错误: 严重性 代码 说明 ...
- 前端MVC Vue2学习总结(四)——条件渲染、列表渲染、事件处理器
一.条件渲染 1.1.v-if 在字符串模板中,如 Handlebars ,我们得像这样写一个条件块: <!-- Handlebars 模板 --> {{#if ok}} <h1&g ...
- jquery UI autocomplete当输入框焦点聚焦时自动弹出跟随下拉框
$("#search").autocomplete({ minLength: 0, source: function(request,response){ // request对象 ...
- 网络实时流量监控工具iftop---转
网络实时流量监控工具iftop 分类: LINUX 1.安装依赖软件库 [root@localhost ~]# yum install libpcap libpcap-devel ncurses nc ...
- js的Date对象
1.构造Date对象 var dt = new Date(); //获取当地包含日期和时间的对象,格式为:Thu Aug 31 2017 09:15:43 GMT+0800 (中国标准时间) 2.使用 ...
- python 小脚本升级-- 钉钉群聊天机器人
一则小脚本(工作中用) 在这篇文章中写的监控的脚本,发送监控的时候 是利用的邮箱,其实在实际,邮箱查收有着不方便性,于是乎升级, 我们工作中,经常用钉钉,那么如果要是能用到钉钉多好,这样我们的监控成功 ...
- shiro中 UnknownAccountException
一 shiro的session.request和response与服务端容器自身的这三个对象的关系 在web.xml中配置了一个Filter,拦截/*,所有的uri.在拦截器中还会调用ShiroFil ...