专业 JavaScript 程序员面试题（附答案）

Pro JavaScript programmer interview questions (with answers)

提问by Janusz Skonieczny

What are good questions to determine if applicant is really a pro JavaScript (browser side) developer ?

确定申请人是否真的是专业 JavaScript（浏览器端）开发人员的好问题是什么？

Questions that can distinguish if someone is not an ad-hoc JavaScript programmer, but is really doing professional JavaScript development, object-oriented, reusable, and maintainable.

可以区分某人是否不是临时 JavaScript 程序员，而是真正从事专业 JavaScript 开发、面向对象、可重用和可维护的问题。

Please provide answers, so an intermediate and ad-hoc JavaScript programmers can interview someone more experienced, coming up with answers to quite few of those advanced questions will elude me. Please avoid open questions.

请提供答案，以便中级和临时 JavaScript 程序员可以采访更有经验的人，对这些高级问题中的很多问题都无法给出答案。请避免开放性问题。

Please keep one interview question/answerper SO answerfor better reading experience and easier interview preparation.

请为每个SO 答案保留一个面试问题/答案，以获得更好的阅读体验和更轻松的面试准备。

回答by bcherry

Because JavaScript is such a small language, yet with incredible complexity, you should be able to ask relatively basic questions and find out if they are really that good based on their answers. For instance, my standard first question to gauge the rest of the interview is:

因为 JavaScript 是一种很小的语言，但又具有令人难以置信的复杂性，所以您应该能够提出相对基本的问题，并根据他们的回答找出它们是否真的那么好。例如，我用来衡量面试其余部分的标准第一个问题是：

In JavaScript, what is the difference between var x = 1and x = 1? Answer in as much or as little detail as you feel comfortable.

在 JavaScript 中，var x = 1和之间有什么区别x = 1？尽可能详细或尽可能少地回答您觉得舒服的问题。

Novice JS programmers mighthave a basic answer about locals vs globals. Intermediate JS guys should definitely have that answer, and should probably mention function-level scope. Anyone calling themselves an "advanced" JS programmer should be prepared to talk about locals, implied globals, the windowobject, function-scope, declaration hoisting, and scope chains. Furthermore, I'd love to hear about [[DontDelete]], hoisting precedence (parameters vs varvs function), and undefined.

新手 JS 程序员可能对局部变量与全局变量有一个基本的答案。中级 JS 人员绝对应该有这个答案，并且可能应该提到函数级作用域。任何自称“高级”JS 程序员的人都应该准备好谈论局部变量、隐含全局变量、window对象、函数作用域、声明提升和作用域链。此外，我很想知道[[DontDelete]]、提升优先级（参数 vs varvs function）和undefined.

Another good question is to ask them to write a sum()function that accepts any number of arguments, and returns their sum. Then, ask them to use that function (without modification) to sum all the values in an array. They should write a function that looks like this:

另一个好问题是让他们编写一个sum()函数，该函数接受任意数量的参数，并返回它们的总和。然后，让他们使用该函数（未经修改）对数组中的所有值求和。他们应该编写一个如下所示的函数：

function sum() {
  var i, l, result = 0;
  for (i = 0, l = arguments.length; i < l; i++) {
    result += arguments[i];
  }
  return result;
}
sum(1,2,3); // 6

And they should invoke it on your array like this (context for applycan be whatever, I usually use nullin that case):

他们应该像这样在您的数组上调用它（上下文apply可以是任何内容，我通常null在这种情况下使用）：

var data = [1,2,3];
sum.apply(null, data); // 6

If they've got those answers, they probably know their JavaScript. You should then proceed to asking them about non-JS specific stuff like testing, workflows, version control, etc. to find out if they're a good programmer.

如果他们得到了这些答案，他们可能知道他们的 JavaScript。然后，您应该继续向他们询问非 JS 特定的内容，例如测试、工作流、版本控制等，以了解他们是否是一名优秀的程序员。

回答by pramodc84

Basic JS programmming

基本的JS编程

• Scope of variable
• What is Associative Array? How do we use it?

• Scope of variable
• 什么是Associative Array？我们如何使用它？

OOPS JS

面向对象的JS

• Difference between Classic Inheritance and Prototypical Inheritance
• What is difference between private variable, public variable and static variable? How we achieve this in JS?
• How to add/remove properties to objectin run time?
• How to achieve inheritance?
• How to extend built-in objects?
• Why extending array is bad idea?

• Difference between Classic Inheritance and Prototypical Inheritance
• 什么是difference between private variable, public variable and static variable？我们如何在 JS 中实现这一点？
• 如何add/remove properties to object在运行时？
• 如何实现inheritance？
• 怎么extend built-in objects办？
• 为什么extending array is bad idea？

DOM and JS

DOM 和 JS

• Difference between browser detection and feature detection
• DOM Event Propagation
• Event Delegation
• Event bubbling V/s Event Capturing

• Difference between browser detection and feature detection
• DOM Event Propagation
• Event Delegation
• Event bubbling V/s Event Capturing

Misc

杂项

• Graceful Degradation V/s Progressive Enhancement

• Graceful Degradation V/s Progressive Enhancement

回答by Anil Namde

Ask about "this". This is one good question which can be true test of JavaScript developer.

询问“这个”。这是一个很好的问题，可以真正测试 JavaScript 开发人员。

回答by Matt

(I'm assuming you mean browser-side JavaScript)

（我假设您指的是浏览器端 JavaScript）

Ask him why, despite his infinite knowledge of JavaScript, it is still a good idea to use existing frameworks such as jQuery, Mootools, Prototype, etc.

问他为什么，尽管他对 JavaScript 有无限的了解，但使用现有的框架（例如 jQuery、Mootools、Prototype 等）仍然是一个好主意。

Answer: Good coders code, great coders reuse. Thousands of man hours have been poured into these libraries to abstract DOM capabilities away from browser specific implementations. There's no reason to go through all of the different browser DOM headaches yourself just to reinvent the fixes.

回答：好的编码器代码，好的编码器重用。数以千计的工时已投入到这些库中，以将 DOM 功能从浏览器特定的实现中抽象出来。没有理由仅仅为了重新发明修复程序而自己解决所有不同的浏览器 DOM 问题。

回答by Jonny Buchanan

Ask them how they ensure their pages continue to be usable when the user has JavaScript turned off or JavaScript isn't available.

询问他们如何确保在用户关闭 JavaScript 或 JavaScript 不可用时他们的页面继续可用。

There's no One True Answer, but you're fishing for an answer talking about some strategies for Progressive Enhancement.

没有唯一正确的答案，但您正在寻找有关渐进增强的一些策略的答案。

Progressive Enhancement consists of the following core principles:

• basic content should be accessible to all browsers
• basic functionality should be accessible to all browsers
• sparse, semantic markup contains all content
• enhanced layout is provided by externally linked CSS
• enhanced behavior is provided by [[Unobtrusive JavaScript|unobtrusive]], externally linked JavaScript
• end user browser preferences are respected

渐进增强包括以下核心原则：

• 所有浏览器都应该可以访问基本内容
• 所有浏览器都应该可以访问基本功能
• 稀疏的语义标记包含所有内容
• 增强的布局由外部链接的 CSS 提供
• 增强的行为由 [[Unobtrusive JavaScript|unobtrusive]] 提供，外部链接的 JavaScript
• 尊重最终用户浏览器偏好

回答by Robusto

Ask how accidental closuresmight cause memory leaks in IE.

询问意外关闭如何导致 IE 中的内存泄漏。

回答by tvanfosson

Ask "What unit testing framework do you use? and why?"

问“你使用什么单元测试框架？为什么？”

You can decide if actually using a testing framework is really necessary, but the conversation might tell you a lot about how expert the person is.

您可以决定是否真的有必要使用测试框架，但对话可能会告诉您很多有关此人的专家水平的信息。

回答by Dustin Getz

intermediate programmers should have technical mastery of their tools.

中级程序员应该对他们的工具有技术掌握。

if he's passed the technical phone screen-esque questions above, make him sketch out something stupid on the spot, like an ajax url shortner. then grill him on his portfolio. no amazing portfolio = intermediate developer in this domain and not the guy you want in charge of your shiny new project.

如果他通过了上面的技术电话屏幕式问题，让他当场草拟一些愚蠢的东西，比如 ajax url shortner。然后在他的投资组合上烤他。没有惊人的投资组合 = 这个领域的中级开发人员，而不是你想要的负责你闪亮的新项目的人。