JS {}代码块中关于函数声明的问题

JS {}代码块中关于函数声明的问题

        正常情况下函数声明会有声明提升的现象,会被提升到当前作用域的顶部,但如果函数声明出现在代码块中会出现不一样的情况。(IE10以下版本除外)

	foo()
        var a = true;
        if (a) {
            function foo() {
                console.log("a");
            }
        } else {
            function foo() {
                console.log("b");
            }
        }

        运行这段代码按照正常声明提升的理解,应该会打印b,但这里会直接报错
在这里插入图片描述
        也许可以解释为if和else,这时a没有值所以函数没有值,但看下面这个例子

  foo()
        {
            function foo() {
                console.log("a");
            }
        } 

在这里插入图片描述
        这里依然报错,而且不是报"foo is not defined",这里报了一个"foo is not a function"。接下来看这段代码

foo()
        var foo = function (){
            console.log("a")
        }

在这里插入图片描述
        可以看到这里的报错和函数表达式的声明提升报错一样,回到第一个例子,我们不直接调用,直接console.log(foo)
在这里插入图片描述
        undefined说明当前作用域是有foo变量的,但它的值为undefined所以不能直接调用。
        因此有可能函数声明在代码块中会被转换成表达式声明,在全局作用域中创建了这个变量明,但具体的值需要在代码执行后才会被赋予。

foo()
        {
            function foo() {
                console.log("a");
            }
        } 

拿这个例子来说,应该与下列代码类似

foo()
        {
         var foo = function() {
                console.log("a");
            }
        }

具体是显示声明提升还是隐式声明提升呢,这里只需要执行一下
delete window.foo 看看foo是否还存在,结果foo是删除不掉的,说明这里应该是显示声明提升。

猜你喜欢

转载自blog.csdn.net/evail_/article/details/107558862