前端 - JavaScript中为什么找不到条件语句中定义的函数

问题描述

问 题

在Chrome中实验以下代码：

function f(){
    console.log("outside f()");
}
+function (){
    if(false){
        function f(){
            console.log("inside f()");
        }
    }
    f(); // Uncaught TypeError: f is not a function
}();

在外部定义函数f，它输出"outside f()"，而在之后的IIFE中也定义了一个f，然后执行这个f函数，但是输出Uncaught TypeError: f is not a function。

但是，如果我把if条件改为true，则会输出inside f()。

我注意到，这个异常是TypeError类型错误，这说明它确实找到了f这个变量，但是它不是一个函数类型，这似乎表明在这个IIFE作用域中已经存在一个f变量，它屏蔽了外部的f函数。

我不明白这个机制到底是怎么回事。不是说函数和变量会有一个提升过程吗？此时无论if语句是什么，内部的f应该是能找到才对，再不济还可以按照作用域链上寻查找到外部定义的f函数呀？此时内部莫名其妙多出一个名为f、值是undefined的变量是怎么回事？可以说在代码块中定义一个函数，就会多出一个与这个函数名相同的一个变量吗？如果是变量提升我还能理解，函数提升我也能理解，但是函数却以变量形式提升我就有点不明白了。

解决方案

其实函数也就是一个变量啊，只不过是类型是函数罢了。
函数的提升可以这么理解

if(false){
    function f(){
        console.log("inside f()");
    }
}

等价于

var f；
if(false){
    f = function(){
        console.log("inside f()");
    }
}

现在比较新版本的chrome和firefox下应该都是这样的，也就是说，if或是block({})内的函数声明不会被提前到外部，同时在这些地方进行函数声明也不符合规范。
具体可以看http://statichtml.com/2011/sp...

这篇关于前端 - JavaScript中为什么找不到条件语句中定义的函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！