JS 函数提升&变量提升以及函数声明&函数表达式的区别
感谢原文作者:迟早会有猫
原文链接:https://www.cnblogs.com/SidselLoong/p/10515809.html
今天看js的变量提升问题,里面提到了函数提升。然后发现自己之前一直把函数声明和函数表达式弄错,导致函数提升出错
一、变量提升
console.log(a)
var a=100 //undefined
console.log(a)//100
提升后相当于
var a; //变量提升,全局作用域范围内,此时只是声明,并没有赋值
console.log(a); //undefined
a=100 //此时赋值
console.log(a) //100
二、函数提升
注意:js中创建函数有两种方式:函数声明和函数表达式。只有函数才能函数提升!!!
(因为之前一直没有分清函数声明和函数表达式,所以在函数提升上经常出错 ==)
先简单认识下函数声明和函数表达式
//函数声明
function fn1(){
console.log(12)
}
//函数表达式
var fn2 = function () {
console.log(222)
}
f1() //123
f2() //error:f2 is not a function
// 函数声明
function f1() {
console.log(123)
}
// 函数表达式
var f2 = function() {
console.log(222)
}
提升后
// 函数声明-----提升
function f1() {
console.log(123)
}
var f2;
f1() //123
f2() //error:f2 is not a function
// 函数表达式
f2 = function() {
console.log(222)
}
2.1函数提升
fn('zhangsan') //zhangsan 20
function fn(name) {
age = 20
console.log(name,age)
var age
}
提升后相当于
function fn(name) {
var age; //变量提升,定义age
age=20; //变量赋值
console.log(name,age)
}
fn('zhangsan')
2.2函数表达式
fn1('lisi')//fn1 is not a function
var fn1=function (name){
age = 20
console.log(name,age)
var age
}
提升效果
var fn1;
fn1('lisi')//fn1 is not a function
fn1=function (name){
var age;
age = 20
console.log(name,age)
}
我的理解
变量提升:将变量声明提至当前scope的最顶部,赋值语句留在原地!所以在赋值语句前调用会出现undefined
。
函数提升:分为两种,一种是纯函数提升,一种是函数表达式提升,函数表达式实质上就是变量提升,另外函数提升的优先级比变量提升高!
另外查阅
https://www.runoob.com/js/js-hoisting.htmlhttps://www.cnblogs.com/liuhe688/p/5891273.html
https://www.cnblogs.com/damonlan/archive/2012/07/01/2553425.html
https://zhuanlan.zhihu.com/p/43607950
JS 函数提升&变量提升以及函数声明&函数表达式的区别的更多相关文章
- 【JS】函数提升变量提升以及函数声明和函数表达式的区别
今天看js的变量提升问题,里面提到了函数提升.然后发现自己之前一直把函数声明和函数表达式弄错,导致函数提升出错 一.变量提升 console.log(a) var a=100 //undefined ...
- js中的变量提升与函数提升
先看看一个简单的代码 var str='Hello World'; alert(str);//弹出 Hello World 再看一段代码: var v='Hello World'; (function ...
- js中的变量提升和函数提升
从上周开始,我所在的学习小组正式开始了angular的学习,angular是全面支持es6的,所以语法上和以前的angular有了很大的不同,比如变量声明时就抛弃了var,而选择了let和const: ...
- js函数、变量提升(hoisting)
其实我只是想复习下变量提升的,然后看到了函数提升,然后再看到了函数声明.函数表达式. 有必要怀着敬仰之心提及园子里的TOM大叔的解密命名函数表达式,不愧是大叔,好好地脑补了下基础知识. 在ECMASc ...
- JS 会有变量提升和函数提升
JavaScript变量函数声明提升(Hoisting)是在 Javascript 中执行上下文工作方式的一种认识(也可以说是一种预编译),从字面意义上看,"变量提升"意味着变量和 ...
- JS高级_变量提升和函数提升
先执行变量提升,后执行函数提升 function a(){} var a console.log(typeof a)//function
- JS基础_变量提升和函数提升
1.在函数中,不使用var声明的变量都会变为全局变量 function fun(){ d=10; //window.d=10; }; console.log(10);//10 2.定义形参就相当于在函 ...
- JavaScript中函数的变量提升问题
函数的大体分三种,一种是函数的声明,一种是函数表达式(又称为函数的字面量) 1.函数的声明 => function myFn(){}; 2.函数的表达式 => var myFn = fun ...
- JS中的 变量提升
首先纠正下,文章标题里的 “变量提升” 名词是随大流叫法,“变量提升” 改为 “标识符提升” 更准确.因为变量一般指使用 var 声明的标识符,JS 里使用 function 声明的标识符也存在提升( ...
随机推荐
- Java 设置系统参数和运行参数
系统参数 系统级全局变量,该参数在程序中任何位置都可以访问到.优先级最高,覆盖程序中同名配置. 系统参数的标准格式为:-Dargname=argvalue,多个参数之间用空格隔开,如果参数值中间有空格 ...
- 初识python 之 自动拆分转换文本内容
上一篇升级版,转换文件内容. #!/user/bin env python # author:Simple-Sir # time:2021/7/9 23:32 def txt_2_list(filen ...
- Go语言实战-爬取校花网图片
一.目标网站分析 爬取校花网http://www.xiaohuar.com/大学校花所有图片. 经过分析,所有图片分为四个页面,http://www.xiaohuar.com/list-1-0.htm ...
- live-server使用指南
一.安装 npm -g install live-server 二.配置 --port=NUMBER` - 选择要使用的端口,默认值:PORT env var或8080--host=ADDRESS` ...
- 查询 MySQL 字段注释的 5 种方法!
很多场景下,我们需要查看 MySQL 中表注释,或者是某张表下所有字段的注释,所以本文就来盘点和对比一下查询注释的几种方式. 创建测试数据库 开始之前咱们先创建一个数据库,以备下面演示使用. -- 如 ...
- 【Java】Collections
文章目录 Collections reverse(List) shuffle(List) sort(List) sort(List,Comparator) swap(List,int, int) Ob ...
- Selenium2+python自动化65-js定位几种方法总结
Selenium2+python自动化65-js定位几种方法总结 前言 本篇总结了几种js常用的定位元素方法,并用js点击按钮,对input输入框输入文本 一.以下总结了5种js定位的方法 除了i ...
- Genymotion安装apk问题,不能部署Genymotion-ARM-Translation_v1.zip
把Genymotion-ARM-Translation_v1.zip拖进去提示 Files successfully copied to: /sdcard/Download 但还是不能安装apk 解决 ...
- Microsoft Store 桌面应用发布流程(一)之打包应用
这篇博客主要是介绍桌面应用打包的流程,应用发布流程请看 Microsoft Store 桌面应用发布流程(二)之提交应用 1. 创建打包项目 打开现有的桌面应用项目.选择解决方案项目,右键选择 添加新 ...
- 【笔记】直接使用protocol buffers的底层库,对特定场景的PB编解码进行处理,编码性能提升2.4倍,解码性能提升4.8倍
接上一篇文章:[笔记]golang中使用protocol buffers的底层库直接解码二进制数据 最近计划优化prometheus的remote write协议,因为业务需要,实现了一个remote ...