每周JS之变量提升和函数提升

Posted 隔壁小王66

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了每周JS之变量提升和函数提升相关的知识,希望对你有一定的参考价值。

JS中变量会预解析,所谓的预解析就是:在当前作用域中,javascript代码执行之前,浏览器首先会默认的把所有带var和function声明的变量进行提前的声明或者定义。

为什么变重点标注,当前作用域,因为在函数里外会将变量提升到不同的地方,通俗将,函数外,提升至全局作用域顶部,函数内,函数内部作用域顶部

目录

  • 变量提升
  • 函数提升

变量提升

会将声明的变量进行提升,变量的赋值还在当前位置,不做提升

例如

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

结果:undefined

解释:JS将变量的声明和赋值拆解开来,变量声明在当前作用域置顶

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

  function b() 
    console.log(a);
    var a = 2;
  
  b();

结果:undefined,undefined

原理同上,只不过作用域不通

编译后相当于

var a;
console.log(a);
a=1;
function b()
	var a;
	console.log(a);
	a=2;

函数提升

  1. 函数提升只提升函数声明,而不会提升函数表达式,这点跟变量是一致的
  2. 函数提升将函数体整个在作用域内置顶

例如

	console.log(a);
 	console.log(b);
  
  
  function a() 
    console.log('a');
  

  var b=function b() 
    console.log('b');
  

执行结果


编译后相当于

var  b;
function a() 
    console.log('a');
  
console.log(a);
console.log(b);

function b() 
    console.log('b');
  

在编译时把变量的声明和函数的声明在当前作用域置顶,赋值的函数表达式则如同变量赋值,还在原位置执行

console.log(a);
  console.log(a());
  
  console.log(b);
  
  
  function a() 
    console.log('a');
  

  var b=function b() 
    console.log('b');
  

稍微改变一下,执行了a函数,这里会先打印a函数里的’a’,在打印a(),因为a函数没有return 返回值,所以这里会打印undefine

结果

以上是关于每周JS之变量提升和函数提升的主要内容,如果未能解决你的问题,请参考以下文章

每周JS之变量提升和函数提升

js中的函数提升和变量提升

JavaScript系列文章:变量提升和函数提升

js变量提升和函数提升

函数和变量中的预解析

一个例子,变量提升和函数提升就是这么简单!