为什么我的JavaScript函数名称会发生​​冲突？

Question

我写了下面的脚本,只是为了看一个变量和一个分配了函数的函数的名字发生冲突时会发生什么:

var f = function() {
    console.log("Me original.");
}

function f() {
    console.log("Me duplicate.");
}

f();

我得到的输出是"我原创".为什么没有调用其他函数？

另外,如果我将原来的作业改为var f = new function() {,我会得到"我原创",然后是TypeError说object is not a function.有人可以解释一下吗？

Answer 1

函数声明在JavaScript中被提升(移到顶部).虽然在解析顺序方面不正确,但由于函数声明被挂起,因此您所拥有的代码在语义上与以下相同:

function f() {
    console.log("Me duplicate.");
}
var f = function() {
    console.log("Me original.");
}


f();

反过来,除了函数的名称外,它与以下内容相同:

var f = function() {
    console.log("Me duplicate.");
}
var f = function() {
    console.log("Me original.");
}


f();

反过来,由于可变吊装与以下相同:

var f;
f = function() {
    console.log("Me duplicate.");
}
f = function() {
    console.log("Me original.");
}

f();

哪个解释了你得到的东西,你正在重写这个功能.更一般地说,varJavaScript中允许多个声明 - var x = 3; var x = 5完全合法.在新的ECMAScript 6标准中,let声明禁止这样做.

@kangax的这篇文章在javascript中揭开功能的神秘面纱方面做得非常出色

Answer 2

如果看起来没有人回答你的后续问题,那么我会在这里回答,尽管你通常应该将后续问题作为单独的问题来回答.

你问为什么这个:

var f = new function() {
    console.log("Me original.");
}

function f() {
    console.log("Me duplicate.");
}

f();

打印出"我原创".然后是一个错误.

这里发生的是new导致函数用作构造函数.所以这相当于以下内容:

function myConstructor() {
    console.log("Me original.");
}
var f = new myConstructor();

function f() {
    console.log("Me duplicate.");
}

f();

并且由于Benjamin解释的功能提升,上面基本上等同于:

var myConstructor = function() {
    console.log("Me original.");
};
var f = function() {
    console.log("Me duplicate.");
};

f = new myConstructor();

f();

这个表达式:

var f = new function() {
    console.log("Me original.");
}

f使用匿名函数作为构造函数,导致构造和分配新对象."我原创." 在构造函数执行时打印出来.但是构造的对象本身并不是一个函数,所以当它最终执行时:

f();

你得到一个错误,因为f它不是一个函数.