前言

在js中，最基本的声明方式有三种，即：var，let，const，为什么在已经有var关键字的前提下，js后续更新了let和const关键字，那就说明var本身是有缺点的或者说不够直观严谨，本文将介绍var关键字引发的问题----提升。

一、什么是js里的提升？

直接上代码：

console.log(a);
var a=3;

按理说，按照js单线程的逻辑，这里输出的应该是报错，即
a is not defined
因为我们想的是在没有定义a之前打印输出了a变量，理应报这个我们还未定义a的错误，可事实真的如此吗，我们来看实际输出的结果：

undefined

结果竟然输出的是undefined，也就是js认为现在a已经定义过了，但是没赋值。
这是怎么回事？我们明明把定义和赋值写在了第二行。
这，就是本文介绍的，提升。

二、js变量提升

console.log(a);
var a=6;

简单说就是在js代码执行前引擎会先进行预编译，预编译期间会将变量声明与函数声明提升至其对应作用域的最顶端。
也就是说刚才的代码，js的执行过程其实是这样的：

var a;
console.log(a)
a=6;

js的var关键字把变量声明，提升到了最顶端，然后才去执行剩下的编译代码，这也是最基本的变量提升案例了。
注意：变量提升只提升声明，不提升赋值

三、js函数提升

我们来看这样一个例子

function chifan(){console.log('我要吃米饭')
}
chifan()
function chifan(){console.log('我要吃面')
}
chifan()

可以看到，定义了chifan函数，分别输出两个字符串，按照我们对js单线程的逻辑理解，执行的代码结果应该是：
‘我要吃米饭’
‘我要吃面’
可实际上呢：

'我要吃面'
'我要吃面'

这就是所谓的js的函数提升，我们使用的是函数声明的方式，所以js会有类似于变量提升的函数提升，与变量提升不同，函数提升不仅仅提升函数声明，而是提升函数整体，具体过程即：

var chifan=function (){console.log('我要吃米饭')
}
var chifan=function (){console.log('我要吃面')
}
chifan()
chifan()

我们可以看到，函数提升不仅仅把声明做了提升，同时还把赋值跟着声明一起提升到了最前面

再来看下面这个例子

var game=function (){console.log('玩英雄联盟')
}
game()
var game=function (){console.log('玩CSGO')
}
game()

这里并没有用函数声明的方式，而用的是函数表达式的方式，所以并不存在函数整体提升，仅仅也只是声明提升，具体执行过程如下：

var game
var game
game=function (){console.log('玩英雄联盟')
}
game()
game=function (){console.log('玩CSGO')
}
game()

所以输出的结果当然是：

'玩英雄联盟'
'玩CSGO'

四、特殊情况

看下面这段代码：

console.log(drink)
function drink(){console.log('酒')
}
var drink='饮料'

这里我们可以看到drink即是函数声明的函数，又在最后赋值了一次，这样去执行时，如果变量名称跟已经声明的形式参数或函数相同，则变量声明不会干扰已经存在的这类属性，具体编译过程如下：

var drink=function drink(){console.log('酒')
};
console.log(drink);
var drink='饮料';

所以输出的结果当然是：

[function:drink]

因为我们并没有加（），所以打印的就是函数本身而不是函数方法。

总结

本篇介绍了js中的提升，如有错误，欢迎探讨指正。
另外，使用let和const关键字不存在提升，也是现在大多数人不再用var的原因。

js高级第一章--变量提升，函数提升相关推荐

js 变量、函数提升
js 变量.函数提升先简单理解下作用域的概念,方便对变量与函数提升的概念的理解 function foo() {var x = 1;if (x) {var x = 2;}console.log(x) ...
关于JavaScript的变量和函数提升
第一种理解方式:let和const不能被使用,直到他们被声明对于var定义的变量,解析器会提升其到作用域顶部. // Outputs: undefined console.log(x);var x ...
js 变量提升函数提升作用域
再说这个知识点前,我们先了解下javascript语言的本质.简单来说js是一个脚本语言,是介于标记语言(例html中使用的标签<.. /> 等是一种被动的,被用来浏览\显示的,无行动能力 ...
javascript变量提升/函数提升
首先 javascript 是一种弱类型.动态的.解释型的脚本语言. 弱类型:类型检查不严格,偏向于容忍隐式类型转换. 强类型:类型检查严格,偏向于不容忍隐式类型转换. 动态类型:运行的时候执行类型检 ...
r语言集合补集_【高中数学必修1研读】之一“第一章集合与函数概念”
第一章:集合与函数概念 [导入例子] "神舟"五号载人航天飞船离地面的距离随时间的变化而变化:上网费用随着上网时间的变化而变化:出国旅游人数日益增多:城市绿化面积不断扩大..... ...
《C程序员从校园到职场》第4章变量和函数
第4章变量和函数路人甲到电信营业厅去交电话费,给营业员说要充50块钱,那个营业员问了一句"How much?"路人甲心想现在社会真的与以往不同了,连一般的营业员都开始流行讲英语 ...
linux_shell 第一章变量
2019独角兽企业重金招聘Python工程师标准>>> #!/bin/sh //解释器 a="1"; //对a进行赋值,等号两边不能有空格,以冒号("& ...
【Node.js】第一章初识Node.js
目录 1.1 浏览器中的javascript的运行环境 1.2 Node.js 简介 1.1 浏览器中的javascript的运行环境 1. 浏览器的组成部分 2. javascript能在浏览器执 ...
同济高等数学：第一章第三节函数的极限
文章目录一.自变量趋于有限值时函数的极限 1.x趋于 x0时的极限的定义根据x趋于x0极限的定义证明极限 2左极限与右极限(单侧极限) 二.自变量趋于无穷大时函数的极限三.函数极限的性质一.自 ...

js高级第一章--变量提升，函数提升

文章目录

前言

一、什么是js里的提升？

二、js变量提升

三、js函数提升

四、特殊情况

总结

js高级第一章--变量提升，函数提升相关推荐

最新文章

热门文章