js变量提升 和函数提升

时间:2022-07-25
本文章向大家介绍js变量提升 和函数提升,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

两个最简单的例子理解变量声明提升和函数声明提升 一、变量提升 变量提升即将变量声明提升到它所在作用域的最开始的部分 例1:

function fn () {
       var a ="hello world1";
      console.log(a); // hello world1
      console.log(b); //undefined
        var b = 'hello world2';
}
fn();

解析:为什么会出现这样的结果; 例1中 代码实际的运行情况应该是这样;

function fn () {
       var a ="hello world1";
      console.log(a); // hello world1
       var b;
      console.log(b); //undefined
       b = 'hello world2';
}

因为变量提升,很简单,就是把变量提升提到函数的最top的地方。 但是我需要说明的是,变量提升 只是提升变量的声明,并不会把赋值也提升上来

二、函数提升 js中创建函数有两种方式:一种是函数表达式,另外一种是函数声明方式。只有函数声明才存在函数提升!如: 例2:

console.log(fun1); // function fun1() {}   
console.log(fun2); // undefined  
function fun1() {}
var fun2 = function() {}

例2中代码的实际

function fun1() {} // 函数提升,整个代码块提升到文件的最开始 
console.log(fun1);   
console.log(fun2);   
var fun2 = function() {}

总结和注意点

1、变量提升

1、通常JS引擎会在正式执行之前先进行一次预编译,在这个过程中,首先将变量声明及函数声明提升至当前作用域的顶端,然后进行接下来的处理

2、如果当前作用域中存在此变量声明,无论它在什么地方声明,引用此变量时就会在当前作用域中查找,不会去外层作用域了

3、let和const关键字没有变量提升

2、函数提升

1、如果在同一个作用域中存在多个同名函数声明,后面出现的将会覆盖前面的函数声明

2、函数声明的优先级最高,会被提升至当前作用域最顶端,所以第一次调用时实际执行了下面定义的函数声明,然后第二次调用时,由于前面的函数表达式与之前的函数声明同名,故将其覆盖,以后的调用也将会打印同样的结果

3、函数的优先权是最高的,它永远被提升至作用域最顶部,然后才是函数表达式和变量按顺序执行