JS变量提升及函数提升实例解析


Posted in Javascript onSeptember 03, 2020

1在js中只有两种作用域

a:全局作用域

b:函数作用域

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

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

JS变量提升及函数提升实例解析

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

2:什么是变量提升?

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

在预解析阶段:首先会在全局作用域内,js解析器会找所有的 var 、function 、参数,并提前到当前作用域的最顶上去(变量的赋值操作不会提前,还在原来的地方),此时并没有执行代码。

然后再开始一行一行执行代码。遇到了函数调用,于是进入到函数作用域内,又开始分两步骤走,1、预解析 2、一步一步执行。以此类推。

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

即变量可以在声明之前使用,值为undefined。

JS变量提升及函数提升实例解析

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

JS变量提升及函数提升实例解析

看几个例子:

JS变量提升及函数提升实例解析

把上面的例子稍作改动:

结果就会大不一样,

JS变量提升及函数提升实例解析

再看一个例子:

JS变量提升及函数提升实例解析

3:什么是函数提升?

JS变量提升及函数提升实例解析

输出的结果是:

JS变量提升及函数提升实例解析

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

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

JS变量提升及函数提升实例解析

例子:

JS变量提升及函数提升实例解析

输出的结果是:

JS变量提升及函数提升实例解析

最后的总结:

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

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

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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
使用基于jquery的gamequery插件做JS乒乓球游戏
Jul 31 Javascript
单击复制文字兼容各浏览器的完美解决方案
Jul 04 Javascript
为什么Node.js会这么火呢?Node.js流行的原因
Dec 01 Javascript
js函数内变量的作用域分析
Jan 12 Javascript
javascript控制层显示或隐藏的方法
Jul 22 Javascript
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
Aug 18 jQuery
基于vue2实现左滑删除功能
Nov 28 Javascript
VUE重点问题总结
Mar 19 Javascript
javascript匿名函数中的'return function()'作用
Oct 15 Javascript
微信小程序MUI侧滑导航菜单示例(Popup弹出式,左侧滑动,右侧不动)
Jan 23 Javascript
vue-devtools的安装和使用步骤详解
Oct 17 Javascript
vue使用echarts图表自适应的几种解决方案
Dec 04 Vue.js
Vue自定义组件双向绑定实现原理及方法详解
Sep 03 #Javascript
Vue js with语句原理及用法解析
Sep 03 #Javascript
Vue通过provide inject实现组件通信
Sep 03 #Javascript
Vue组件通信$attrs、$listeners实现原理解析
Sep 03 #Javascript
Vue父组件监听子组件生命周期
Sep 03 #Javascript
JavaScript 几种循环方式以及模块化的总结
Sep 03 #Javascript
Vuejs通过拖动改变元素宽度实现自适应
Sep 02 #Javascript
You might like
php实现图片添加描边字和马赛克的方法
2014/12/10 PHP
PHP file_get_contents函数读取远程数据超时的解决方法
2015/05/13 PHP
Yii2中DropDownList简单用法示例
2016/07/18 PHP
基于PHP制作验证码
2016/10/12 PHP
PHP用swoole+websocket和redis实现web一对一聊天
2019/11/05 PHP
javascript+xml实现简单图片轮换(只支持IE)
2012/12/23 Javascript
jquery控制页面部分刷新的方法
2015/06/24 Javascript
Javascript基础之数组的使用
2016/05/13 Javascript
node.js学习之交互式解释器REPL详解
2016/12/08 Javascript
vue中父子组件注意事项,传值及slot应用技巧
2018/05/09 Javascript
Layui 设置select下拉框自动选中某项的方法
2018/08/14 Javascript
vue+canvas实现炫酷时钟效果的倒计时插件(已发布到npm的vue2插件,开箱即用)
2018/11/05 Javascript
微信小程序功能之全屏滚动效果的实现代码
2018/11/22 Javascript
vue项目中使用vue-i18n报错的解决方法
2019/01/13 Javascript
[08:17]Ti9 现场cosplay
2019/09/10 DOTA
[03:13]DOTA2-DPC中国联赛1月25日Recap集锦
2021/03/11 DOTA
python学习笔记:字典的使用示例详解
2014/06/13 Python
PyTorch上搭建简单神经网络实现回归和分类的示例
2018/04/28 Python
TensorFlow实现卷积神经网络
2018/05/24 Python
Django的Modelforms用法简介
2019/07/27 Python
python 使用socket传输图片视频等文件的实现方式
2019/08/07 Python
python 基于dlib库的人脸检测的实现
2019/11/08 Python
Django如何使用jwt获取用户信息
2020/04/21 Python
Python urllib.request对象案例解析
2020/05/11 Python
python如何进行矩阵运算
2020/06/05 Python
索尼巴西商店:Sony巴西
2019/06/21 全球购物
质检的岗位职责
2013/11/17 职场文书
销售文员的岗位职责
2013/11/20 职场文书
竞选班干部演讲稿
2014/04/24 职场文书
中学生励志演讲稿
2014/04/26 职场文书
企业公益活动策划方案
2014/08/24 职场文书
2014年管理工作总结
2014/11/22 职场文书
读后感作文评语
2014/12/25 职场文书
龙门石窟导游词
2015/02/02 职场文书
刑事上诉状(量刑过重)
2015/05/23 职场文书
Mybatis-Plus 使用 @TableField 自动填充日期
2022/04/26 Java/Android