详解javascript中的变量提升和函数提升


Posted in Javascript onMay 24, 2018

1在js中只有两种作用域

a:全局作用域

b:函数作用域

在ES6之前,js是没有块级作用域。

首先来解释一下什么是没有块级作用域?

详解javascript中的变量提升和函数提升

所以此时 是可以打印输出变量a的值。

2:什么是变量提升?

在我们的js中,代码的执行时分两步走的,1、解析 2、一步一步执行

那么变量提升就是变量声明会被提升到作用域的最顶上去,也就是该变量不管是在作用域的哪个地方声明的,都会提升到作作用域的最顶上去。

详解javascript中的变量提升和函数提升

那么上面这种写法其实等价于下面这种写法:

详解javascript中的变量提升和函数提升

看几个例子:

详解javascript中的变量提升和函数提升

把上面的例子稍作改动:

结果就会大不一样,

详解javascript中的变量提升和函数提升

再看一个例子:

详解javascript中的变量提升和函数提升

3:什么是函数提升?

详解javascript中的变量提升和函数提升

输出的结果是:

详解javascript中的变量提升和函数提升

注意:函数声明式,会将函数的声明和定义一起提升到作用域的最顶上去。

如果是这种写法:函数表达式声明的函数

详解javascript中的变量提升和函数提升

例子:

详解javascript中的变量提升和函数提升

输出的结果是:

详解javascript中的变量提升和函数提升

最后的总结:

1:所有的声明都会提升到作用域的最顶上去。

2:同一个变量只会声明一次,其他的会被忽略掉。

3:函数声明的优先级高于变量申明的优先级,并且函数声明和函数定义的部分一起被提升。

Javascript 相关文章推荐
IE与Firefox在JavaScript上的7个不同句法分享
Oct 30 Javascript
Javascript图像处理—亮度对比度应用案例
Jan 03 Javascript
JavaScript作用域示例详解
Jul 07 Javascript
vue.js单页面应用实例的简单实现
Apr 10 Javascript
详解通过JSON数据使用VUE.JS
May 26 Javascript
JS按钮闪烁功能的实现代码
Jul 21 Javascript
利用Blob进行文件上传的完整步骤
Aug 02 Javascript
记录一篇关于redux-saga的基本使用过程
Aug 18 Javascript
vue监听对象及对象属性问题
Aug 20 Javascript
JS大坑之19位数的Number型精度丢失问题详解
Apr 22 Javascript
微信小程序下拉菜单效果的实例代码
May 14 Javascript
深入理解javascript prototype的相关知识
Sep 19 Javascript
JavaScript轮播停留效果的实现思路
May 24 #Javascript
vue2单元测试环境搭建
May 24 #Javascript
Vue+mui实现图片的本地缓存示例代码
May 24 #Javascript
vue组件name的作用小结
May 23 #Javascript
linux 后台运行node服务指令方法
May 23 #Javascript
node.js部署之启动后台运行forever的方法
May 23 #Javascript
jquery引入外部CDN 加载失败则引入本地jq库
May 23 #jQuery
You might like
PHP下一个非常全面获取图象信息的函数
2008/11/20 PHP
php 表单数据的获取代码
2009/03/10 PHP
php实现的简单日志写入函数
2015/03/31 PHP
我整理的PHP 7.0主要新特性
2016/01/07 PHP
Laravel事件监听器用法实例分析
2019/03/12 PHP
laravel框架的安装与路由实例分析
2019/10/11 PHP
HTML TO JavaScript 转换
2006/06/26 Javascript
Jquery ThickBox插件使用心得(不建议使用)
2010/09/08 Javascript
jquery选择器(常用选择器说明)
2010/09/28 Javascript
Web Inspector:关于在 Sublime Text 中调试Js的介绍
2013/04/18 Javascript
js监听鼠标事件控制textarea输入字符串的个数
2014/09/29 Javascript
javascript获取当前鼠标坐标的方法
2015/01/10 Javascript
基于jQuery实现美观且实用的倒计时实例代码
2015/12/30 Javascript
Bootstrapvalidator校验、校验清除重置的实现代码(推荐)
2016/09/28 Javascript
Bootstrap基本插件学习笔记之Popover提示框(19)
2016/12/08 Javascript
jQuery中hover方法搭配css的hover选择器,实现选中元素突出显示方法
2017/05/08 jQuery
vue框架下部署上线后刷新报404问题的解决方案(推荐)
2019/04/03 Javascript
Vue.js中该如何自己维护路由跳转记录
2019/05/19 Javascript
linux服务器快速卸载安装node环境(简单上手)
2021/02/22 Javascript
[01:34]DAC2018主赛事第四日五佳镜头 Gh巨牙海民助Miracle-死里逃生
2018/04/07 DOTA
[00:35]可解锁地面特效
2018/12/20 DOTA
python爬虫 Pyppeteer使用方法解析
2019/09/28 Python
python实现从wind导入数据
2019/12/03 Python
Python 利用OpenCV给照片换底色的示例代码
2020/08/03 Python
python不同版本的_new_不同点总结
2020/12/09 Python
用gpu训练好的神经网络,用tensorflow-cpu跑出错的原因及解决方案
2021/03/03 Python
使用 css3 transform 属性来变换背景图的方法
2019/05/07 HTML / CSS
详解HTML5之pushstate、popstate操作history,无刷新改变当前url
2017/03/15 HTML / CSS
英国知名的皮手套品牌:Dents
2016/11/13 全球购物
什么是静态路由?什么是动态路由?各自的特点是什么?
2015/09/16 面试题
十一酒店活动方案
2014/02/20 职场文书
车辆委托书范本
2014/10/05 职场文书
投标承诺函范文
2015/01/21 职场文书
企业年会祝酒词
2015/08/11 职场文书
公司晚会主持词
2019/04/17 职场文书
Python 避免字典和元组的多重嵌套问题
2022/07/15 Python