Javascript函数解析顺序

4

请问为什么下面的函数返回值是1.5?Javascript是从下往上解析代码吗?还是还有其他原因导致这种结果?

    (function f() {
        function f() { return 1; }
        return f();
        function f() { return 2; }
        function f() { return 1.5; }
    })();

6
这种行为被称为提升。Google一下吧! - Florent
我学习时添加了一个示例,可能会对你有帮助。JavaScript 'hoisting' - Grijesh Chauhan
3个回答

4

函数被“提升”到它们所在的作用域顶部。

因此,您的代码实际上是这样的:

(function f() {
    function f() { return 1; }
    function f() { return 2; }
    function f() { return 1.5; }
    return f();
})();

QED:
(function f() {
    function f() { return 1; }
    return f();
    function f() { return 1.5; }
    function f() { return 2; }
})(); //=> 2

@GrijeshChauhan 没关系,我主要不是为了投票而参与其中 ;) - KooiInc
@kooilnc 然后加入一些理论,定义什么是托管(hosting)... 我觉得如果有人对此不熟悉,这篇文章就显得不完整了。 - Grijesh Chauhan
我看到了链接,我同意...谢谢!顺便说一下,今天我挑选了一本,我读了第一章,感觉不错..你有什么建议吗? - Grijesh Chauhan
1
我学到了很多脚本编写的技巧,都是通过在Stack Overflow上尝试回答问题来实践的。还有一些非常好的在线资源可以免费学习,比如http://eloquentjavascript.net/print.html或http://www.codecademy.com/tracks/jquery。我曾经尝试过阅读编程书籍,但大多数时候它们让我感到无聊,最后我要么重新编写示例代码,要么就在读完书之前忘记了它们。 - KooiInc
@KooiInc 谢谢Kooilnc,我非常喜欢这个链接(http://eloquentjavascript.net/contents.html),并下载了HTML-zip。谢谢! - Grijesh Chauhan
显示剩余3条评论

1

jsFiddle演示

由于变量提升,这等同于

(function f(){
 var f;
 f = function(){ return 1; };
 f = function(){ return 2; };
 f = function(){ return 1.5; };
 return f();
})();

Hoisting可能会有些棘手,因为这里涉及到两个方面。首先,变量定义被提升了。

每个变量的定义实际上是在其作用域顶部声明变量并在定义处进行赋值。1

接下来,每个函数初始化都被提升了。

函数初始化发生在父函数的顶部(在vars之上)。由于具有与参数或函数重名的vars声明是无操作的,因此我们得到了一些令人惊讶的结果。1

1: Scope Cheatsheet MDN


其实你们两个都没有定义什么是所谓的“提升”?但是我懂了。 - Grijesh Chauhan
1
@GrijeshChauhan - 请查看编辑内容,了解关于提升的附加信息。 - Travis J

1
当JS解释器首次进入函数时,它会查找所有的变量和函数构造(但不包括匿名函数),并按照发现的顺序将它们提升,然后从函数的开头开始执行代码。在你的情况下,返回1.5的f函数是最后一个,因此它覆盖了之前的两个f函数。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接