JS的 if 中的函数声明提升
时间:2022-07-23
本文章向大家介绍JS的 if 中的函数声明提升,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
问题
可以先看看下面的例子,
console.log(a)
if (true) {
a = 1
function a () {}
a = 5
console.log(a)
}
console.log(a)
在开发者工具里可以看到打印出来的值为 undefined 5 1
可以看到, 给a
赋值的5, 并没有赋值到全局变量a
上
解决
先看看MDN里的说明
从ES6开始 在严格模式下,块里的函数作用域为这个块。ES6之前不建议块级函数在严格模式下使用. 在ES6非严格模式下, 块中函数声明会出现提升, 所以最好使用函数表达式来定义函数
走走流程看看到底发生了啥
我们可以先把, function a () {}
注释掉, 可以看到报错了, Uncaught ReferenceError: a is not defined
, 所以if里的函数声明确实存在变量提升
然后, 我们可以打点调试一下
在if 中的a=1
语句之前, 我们可以看到函数声明已经提升了, 此时if作用域里a
为函数
而全局的a
还是undefined
给a=1
后, 可以看到, 全局的a
依然是undefined
, 而块级作用域里, a
的值为1
在运行到 function a () {}
后, 我们可以看到, 块级作用域的a
的值会赋值给全局作用域的a
随后运行a=5
, 则只是在块级作用域里的赋值, 不会对全局作用域的a
值进行修改
当然, 如果使用函数表达式来声明函数的话, 可以避免
var a
if (true) {
console.log(a, window.a)
a = 1
a = function () {}
a = 5
console.log(a)
}
console.log(a)
- 金融科技新常态,未来开启拼“硬实力”阶段
- Mono 3 的默认Gc是Sgen
- Linux下Redis主从复制以及SSDB主主复制环境部署记录
- 单元测试同时支持 NUnit/MSTest
- log4net快速上手
- MySQL高可用方案-PXC环境部署记录
- Redis主从复制下的工作原理梳理
- Linux系统下常用的数据备份方法
- K2 的Workspace 遭遇400 RequestLength 错误修复
- 从零开始学人工智能-Python·决策树(三)·节点
- .net程序员使用Oracle新手上路指南
- python的函数(二):作用域
- 在win2008 r2中安装windows phone 7开发工具
- TFS2008 + Windows2003 + Sql2005 安装注意事项
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 【Pytorch 】笔记四:Module 与 Containers 的源码解析
- 控制pod内container执行顺序的几种姿势
- 本地部署istio多集群(共享控制面)
- elasticsearch unassigned shard
- 【Pytorch 】笔记五:nn 模块中的网络层介绍
- docker浅入深出4
- BFE.dev前端刷题#58. 获取DOM tree高度
- 如何在Tungsten Fabric上整合裸金属服务器(附配置验证过程)
- 逐行阅读Spring5.X源码(三) BeanDefinition的实现类详解,拔高
- 逐行阅读Spring5.X源码(番外篇)BeanDefinition到底有多重要
- 逐行阅读Spring5.X源码(番外篇)AnnotatedBeanDefinitionReader的作用
- 逐行阅读Spring5.X源码(四) BeanFactory——核心容器bean工厂
- 逐行阅读Spring5.X源码(五) 初探BeanFactoryPostProcessor后置处理器,难,特别难。
- 逐行阅读Spring5.X源码(六) ClassPathBeanDefinitionScanner扫描器
- 逐行阅读Spring5.X源码(番外篇)自定义扫描器, Mybatis是如何利用spring完成Mapper扫描的