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

问题描述

问 题

先贴代码哈

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

---------------- 2017/2/22/10:18更新 ----------------

• 昨天问了这个问题后，受到了@xiaoboost 的嘲讽，立马感觉到自己没有先找找类似的问题就提问，挺鲁莽的。所以立即选择了关闭问题（选择与社区已有问题重复）。

• 但是经过昨天晚上的查找以及看了@xiaoboost 的答案后，发现很多答案并不对。这道面试的部分问题确实牵扯到了运算符的优先级。所以我给@xiaoboost 的答案投了反对票。

• 另外，由于我去掉了原面试题的部分代码，造成了@zp1996 的困扰，抱歉。现在已经补全了完整的面试题。

---------------- 2017/2/22/16:28更新 ----------------
抛开面试会不会出这个题，只谈这道题所牵扯到的知识点来说，大家都觉得和运算符优先级没有关系。
那么请问第六问：new Foo().getName()为什么先执行 new Foo()呢？属性访问器与带参数的对象创建表达式优先级是一样的。为什么不是先执行Foo().getName呢？

大家可以看个比较靠谱的回答，当然第六问解释的还不够严谨。
https://segmentfault.com/a/11...

最初的问题是问：new Foo().getName();这一句弹出什么数字以及为什么？我认为这句的问题和运算符的优先级肯定有关系。

我希望大家理性一些，不要急着踩我。

---------------- 2017/2/22/17:13更新 ----------------
这里是出这道题的原作者，文章中有对这道题的解释。从第五问开始就与运算符的优先级有关系了。但是第六问他解释错了，new Foo().getName()中并没有圆括号，所以并不存在圆括号优先级高于成员访问.。
http://www.cnblogs.com/xxcang...

---------------- 可能是最后一次更新 ----------------

各位踩我问题朋友，我发表了一篇专门针对这个问题的文章，欢迎各位前往指出文章错误的地方，谢谢。
传送门：https://segmentfault.com/a/11...

这个问题已被关闭，原因：与社区已有问题重复 - 请输入已有问题网址

解决方案

我个人是不太喜欢这种问题的，但需要解决这个问题确实需要一些基本功。一般来说，程序写多了，自然记住了什么情况下会发生什么样的事情，但是为什么会发生这样的事情，可能问起来一时还真回答不了！

另外，我认为需要对这个问题平个反——它确实涉及到了运算优先级。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() 运算。

其它问题都比较容易理解，我就懒得解释了。希望大家在解决问题的时候尽量少带情绪(我承认我也经常带情绪，但是俗话说：淡定！)

这篇关于一道考察运算符优先级的JavaScript面试题◔ ‸◔?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！