变量提升和函数提升基本上是面试必问题目

//先从一个面试题说起        console.log(a)        if (a) {            var a = 1;            console.log(a)        }        function a() {            console.log(this);        }        console.log(a);        a()        复制代码

下面我们针对这个栗子解析一下

我们知道变量和函数定义都会提升到作用域最前边

唯一需要确认的是变量和函数的先后顺序

我们预想 函数是用第一公民会不会提升到最前边呢？

//如果是解析完顺序是这样的        function a() {            console.log(this);        }        var a;        console.log(a)        if (a) {            a = 1;            console.log(a)        }        console.log(a);        a()复制代码

按照我们预想的解析结果应该是

// undefined // undefined // 报错

理由 函数在上var在下，第一个console时a未赋值，其结果是undefined，if为false 只剩最后一个console也是undefined 最后a is not a function.

不过结果是

我机智的认为 预想错了？

//再次测试        var a;        function a() {            console.log(this);        }        console.log(a)        if (a) {            a = 1;            console.log(a)        }        console.log(a);        a()复制代码

这样？对比一下结果 人工解析结果 ： 1、a() 2、1 3、1 4、a() 报错

浏览器执行结果：

没毛病！

看到这里一切完美，不过我还是重新搜索了一些高质量文章，发现我错了，虽然执行结果是对的，不过浏览器和人工解析还是不一样的，和我们最开始预想的一样，函数优先。

既然标题说到了 变量 和 函数，我们就一块来说说

//简单的栗子function a(){ console.log(a) }console.log(a)var a = 1a()复制代码

首先上边已经说到我们预想和认为的是错的。

正确解析顺序是这样的

function a(){ console.log(a) }var a;console.log(a)a = 1a()复制代码

但是，这个但是很重要浏览器执行结果是：

why？这就要讲讲我所了解到的原理。

同名变量和函数，函数会提升到最前边，变量其次，那为什么结果不是我们人工执行的undefined呢？原因是 变量会被忽略，是的是忽略。。。

function a(){ console.log(a) }var a;//忽略console.log(a) //打印函数本身a = 1a()// a is not a function复制代码

完美！

还有呢？是的还有同名变量是怎样的顺序，同名函数是怎样的顺序。

同名变量

console.log(a)var a = 1console.log(a)var a = 2console.log(a)//解析完顺序是这样的var a；var a; //忽略console.log(a) // undfineda = 1console.log(a) //1a = 2console.log(a)//2复制代码

*同名变量，声明会被提升，后边会忽略。

同名函数

function a(){console.log(1)}console.log(a)function a(){console.log(2)}console.log(a)a()//解析完function a(){console.log(1)}function a(){console.log(2)}console.log(a)console.log(a)a()复制代码

执行结果

我想你已经猜到了，同名函数会被覆盖。

终于完了！

您的点赞是我继续下去的动力，谢谢！