一道考察运算符优先级的JavaScript面试题◔ ‸◔?

Question

先贴代码哈

function Foo() {
  getName = function () {
    alert(1);
  };  return this;
}
Foo.getName = function () {
  alert(2);
};
Foo.prototype.getName = function () {
  alert(3);
};var getName = function () {
  alert(4);
};function getName() {
  alert(5);
}

Foo.getName();
getName();
Foo().getName();
getName();new Foo.getName();new Foo().getName();new new Foo().getName();

问题：页面会弹出数字几？以及为什么？

麻烦前端er帮我解答一下，谢谢。
运算符优先级参考列表：MDN

Answer 1

我个人是不太喜欢这种问题的，但需要解决这个问题确实需要一些基本功。一般来说，程序写多了，自然记住了什么情况下会发生什么样的事情，但是为什么会发生这样的事情，可能问起来一时还真回答不了！另外，我认为需要对这个问题平个反——它确实涉及到了运算优先级。new 是运算符、成员访问是运算(. 运算符)、函数调用是运算……而且题主也给出了 MDN 的链接，大家可以看到这个问题中的运算优先级基本上集中 17、18、19 上，都是很高的优先级。关于优先级，这里需要说明的一点是，表中同一优先级下的多个运算是没有优先顺序的，通常是先遇到哪个就先运算哪个，所以说成员访问优先于 new xxx() 并无道理，但是成员访问的确优先于 new xxx——OK，这里遇到了我认为这个题中是难理解的地方：new Foo.getName() 和 new Foo().getName()，因为 new 的两种形式有两个不同的优先级。new 的两种形式的运算，一个是带括号的，称为带参数列表的 new，优先级18；另一种是不带括号的，称为无参数列表的 new，优先级 17。所以，虽然 new Foo 是合法的构造运算，但是 new Foo.getName() 却是先运算了 Foo.getName 这个成员访问运算。为什么呢？因为如果 new Foo 看作一个运算，它的优先级是 17，低于成员访问运算，所以应该先计算 Foo.getName，对其计算结果再进行 new XXX() 运算。其它问题都比较容易理解，我就懒得解释了。希望大家在解决问题的时候尽量少带情绪(我承认我也经常带情绪，但是俗话说：淡定！)