详解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 相关文章推荐
CSS+Table图文混排中实现文本自适应图片宽度(超简单+跨所有浏览器)
Feb 14 Javascript
Jquery选择器 $实现原理
Dec 02 Javascript
jQuery循环滚动展示代码 可应用到文字和图片上
May 11 Javascript
JQuery操作tr和td内容的方法实例
Mar 06 Javascript
Jquery动态改变图片IMG的src地址示例
Jun 25 Javascript
JavaScript lastIndexOf方法入门实例(计算指定字符在字符串中最后一次出现的位置)
Oct 17 Javascript
JavaScript的9种继承实现方式归纳
May 18 Javascript
JavaScript中innerHTML,innerText,outerHTML的用法及区别
Sep 01 Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 Javascript
基于Jquery Ajax type的4种类型(详解)
Aug 02 jQuery
仿iPhone通讯录制作小程序自定义选择组件的实现
May 23 Javascript
vue+springboot+element+vue-resource实现文件上传教程
Oct 21 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
解析file_get_contents模仿浏览器头(user_agent)获取数据
2013/06/27 PHP
php生成随机数的三种方法
2014/09/10 PHP
PHP使用递归算法无限遍历数组示例
2017/01/13 PHP
XAMPP升级PHP版本实现步骤解析
2020/09/04 PHP
jquery ui dialog ie8出现滚动条的解决方法
2010/12/06 Javascript
jQuery使用before()和after()在元素前后添加内容的方法
2015/03/26 Javascript
js实现不提交表单获取单选按钮值的方法
2015/08/21 Javascript
使用Web Uploader实现多文件上传
2016/06/08 Javascript
jQuery Easy UI中根据第一个下拉框选中的值设置第二个下拉框是否可以编辑
2016/11/29 Javascript
jQuery网页定位导航特效实现方法
2016/12/19 Javascript
10 种最常见的 Javascript 错误(频率最高)
2018/02/08 Javascript
Vue2.0 实现页面缓存和不缓存的方式
2019/11/12 Javascript
微信小程序开发数据缓存基础知识辨析及运用实例详解
2020/11/06 Javascript
video.js添加自定义组件的方法
2020/12/09 Javascript
[01:02:06]LGD vs Mineski Supermajor 胜者组 BO3 第二场 6.5
2018/06/06 DOTA
Django 添加静态文件的两种实现方法(必看篇)
2017/07/14 Python
Python绑定方法与非绑定方法详解
2017/08/18 Python
Python基于sklearn库的分类算法简单应用示例
2018/07/09 Python
Python for循环中的陷阱详解
2018/07/13 Python
Pycharm+django2.2+python3.6+MySQL实现简单的考试报名系统
2019/09/05 Python
解析PyCharm Python运行权限问题
2020/01/08 Python
利用Python计算KS的实例详解
2020/03/03 Python
Python 列表中的修改、添加和删除元素的实现
2020/06/11 Python
HTML5 Canvas的常用线条属性值总结
2016/03/17 HTML / CSS
美国最大的宠物用品零售商:PetSmart
2016/11/14 全球购物
机械系大学毕业生推荐信
2013/11/27 职场文书
会计实习生自我鉴定
2013/12/12 职场文书
食品安全检查制度
2014/02/03 职场文书
护士个人自我鉴定
2014/03/24 职场文书
企业新年寄语
2014/04/04 职场文书
党务公开方案
2014/05/06 职场文书
left join、inner join、right join的区别
2021/04/05 MySQL
详解Vue的sync修饰符
2021/05/15 Vue.js
原生JavaScript实现简单五子棋游戏
2021/06/28 Javascript
postman中form-data、x-www-form-urlencoded、raw、binary的区别介绍
2022/01/18 HTML / CSS
MySQL数据库配置信息查看与修改方法详解
2022/06/25 MySQL