文章目录

一、声明提升
- 1.1 示例讲解（变量提升）
- 1.2 示例讲解（函数提升）
二、解决方案
- 2.1 使用赋值
- - 详解
三、exercise

一、声明提升

声明提升是JavaScript中的一个缺陷，会造成输出结果与所构想的结果不一致。

1. js引擎会将简写形式分解为原形式
2. 将找到的声明依次提前到当前作用域的顶部，集中创建，
3. 赋值将会留在原地

例如:
var a = 10;
=>
var a; a= 10;

在程序开始执行前，找两种东西：

var 变量名;function 函数名(…){…}

1.1 示例讲解（变量提升）

示例代码：

//var a          //会将第三行的var a提到最前面，提前声明变量
console.log(a); //undefined
var a = 1;     //有var才提升
console.log(a); //1

①第一步将var a = 1;的简写形式分解为声明语句和赋值语句

②将声明提升到当前作用域的顶部：

③所以当执行到第一句console.log(a)时，a还未赋值，故为undefined

③当执行到第二句console.log(a)时，a已被赋值1，故为1

1.2 示例讲解（函数提升）

示例代码：

function fun(){console.log(1);}
fun();
function fun(){console.log(2);}
fun();

①首先找到两个function fun(){}，将其提到当前作用域的顶部：

②顶部的两个fun()函数同名，后添加的覆盖前一个，故fun()输出的都是2

二、解决方案

针对1.2的示例代码，我们原意是要输出1,2，由于js的声明提升缺陷，输出结果为2,2。
如何解决这个问题呢？

2.1 使用赋值

“js引擎会将简写形式分解为原形式” “赋值将会留在原地”

代码如下：

var fun = function fun(){console.log(1);}
fun();
var fun = function fun(){console.log(2);}
fun();

详解

①var fun = function fun(){console.log(1);}为简写形式，可分解：

②将var fun;提到当前作用域的顶部

③同理，第二个var fun语句重复上述操作

④顶部语句覆盖：

⑤js引擎进行赋值，首先赋值fun = function(){console.log(1)}，故第一个fun()结果返回1

⑥往下走，赋值fun = function(){console.log(2)}，故第二个fun()值为2

三、exercise

例1：

function fn() {//var b 提升到整个函数作用域的最前边console.log(b);//undefinedvar b = 2;console.log(b);//2
}
fn();

例2：

var c = 3;
function fun() {//var c;console.log(c); //undefinedvar c = 5;      //给当前作用域下的c赋值给5
}
fun();
console.log(c); //3

Javascript——声明提升（函数、变量提升）相关推荐

JavaScript 中的 Hoisting (变量提升和函数声明提升)
如何将函数声明 / 变量 "移动" 到作用域的顶部. 术语 Hoisting(提升) 在很多 JavaScript 博文中被用来解释标识符的解析.其实 Hoisting(提升) ...
Javascript中函数提升和变量提升
词法分析词法分析方法: js运行前有一个类似编译的过程即词法分析,词法分析主要有三个步骤: 分析参数再分析变量的声明分析函数说明具体步骤如下: 函数在运行的瞬间,生成一个活动对象(Active ...
js函数提升和变量提升_关于在js中提升的真相
js函数提升和变量提升 Earlier this week I was preparing to give a tech talk about some foundational JavaScript ...
函数提升与变量提升常见面试题
函数提升与变量提升在JavaScript中,变量的定义和函数的定义都会被提升,而且函数的声明优先于变量的声明:在变量中,变量的赋值不会被提升,只是声明被提升了,但是函数的声明有点不一样,如果是函数式 ...
浅聊JavaScript中的Hoisting(变量提升)
一直有写博客的想法但因为懒惰等各种情况没有付出实际行动,择日不如撞日,那就今天让我给大家简单归纳总结一下JavaScript中的Hoisting(变量提升)吧! 1.对于变量 //variablesc ...
JavaScript系列文章：变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
javascript基础知识(16) 变量提升
JavaScript 变量提升 JavaScript的函数定义有个特点,它会先扫描整个函数体的语句,把所有申明的变量"提升"到函数顶部: JavaScript 中,变量可以在使用后 ...
JavaScript代码输出结果-变量提升问题(答案和知识点详解)
1.下面代码的输出是什么 function sayHi() { console.log(name)console.log(age)var name = "zhangsan"let ...
变量得提升函数得提升
变量得提升 - 使用var声明得变量她会在所有代码执行前被声明所以我们可以在变量声明前就访问变量 - 使用let声明得变量, 实际上也会提升但是在赋值之前解释器禁止访问变量函数得提升 -使用函 ...
函数提升与变量提升的优先级
我看到网上很多人说函数提升优先级高于变量提升,我以前根本就没有听说过,但是我我做题也没有错过,这就有点奇怪,后来发现只是解题思路不一样,但是结果一样!!! 总结一句话就是: 函数提升优先级高于变量提升 ...

Javascript——声明提升（函数、变量提升）

文章目录

一、声明提升

1.1 示例讲解（变量提升）

1.2 示例讲解（函数提升）

二、解决方案

2.1 使用赋值

详解

三、exercise

Javascript——声明提升（函数、变量提升）相关推荐

最新文章

热门文章

Javascript——声明提升（函数、变量提升）

文章目录

一、 声明提升

1.1 示例讲解（变量提升）

1.2 示例讲解（函数提升）

二、解决方案

2.1 使用赋值

详解

三、exercise

Javascript——声明提升（函数、变量提升）相关推荐

最新文章

热门文章

一、声明提升