JavaScript最佳实践

Question

这与这个问题有些关联，但我不是在寻找有关JavaScript最佳实践的资源，而是需要你的实际建议。

我将从自己的列表开始。如果您确定建议不具有争议性，可以发布回答或直接编辑问题。

下面是我的建议：

• always use var
• capitalize names of constructor functions - and nothing else
• use === for comparison
• use explicit casts for primitives, e.g. Number(), String(), Boolean()
• check for primitive types with typeof
• check for object types with instanceof

• check for built-in object types with Object.prototype.toString() to avoid cross-frame issues, e.g.

  Object.prototype.toString.call(obj) === '[object Array]'
  

• check this in constructors, e.g.

  function MyObject() {
      if(!(this instanceof arguments.callee))
          throw new Error('constructor called with invalid `this`');
      // [...]
  }
  

• use anonymous functions for namespacing to not pollute the global scope, e.g.

  (function() {
      var noGlobalVar = 'foo';
      // [...]
  })();
  

• check hasOwnProperty() in for..in loops - don't assume that no one messed with the prototypes

• don't use for..in loops to iterate over elements of arrays or array-like objects

- Christoph

Answer 1

不要干涉核心类型。永远不要将任何东西粘贴到Array.prototype上——你不知道谁还在这样做，以及这样的事情可能会如何相互作用。

只在需要时检查明确的类型。鸭子类型是一个很好的概念。

我想强调使用匿名函数来避免全局范围的污染。特别是当你像我一样经常使用jQuery时，使用这样的模板确实非常有帮助：

(function($) {
    /* Lots of code */
})(jQuery);

- David

Answer 2

这适用于所有语言：

避免深度嵌套，这是不可接受的，也很难阅读。有一些技巧，例如在循环中，您可以使用早期的break或continue下一次迭代，而不是将所有内容包装在一个if中。

- ajax333221

---

JS有3-4个层级？听起来不可能。有时你甚至在开始编写代码之前就已经有了4个层级。考虑将Object.defineProperties(...)放置在闭包(function () {...}())中 - 当你开始编写getter时，它的主体已经处于第4个层级。 - Szymon Wygnański

@SzymonWygnański 谢谢您指出我的错误，那个数字太低了。 - ajax333221

Answer 3

"使用基元类型的显式转换，例如Number()、String()、Boolean()"。

"真的吗？我像瘟疫一样避免使用它们。你对此有什么想法？"

- Nosredna

---

我的想法是使类型转换显式，例如不要做像 a = 3 + document.forms[0].elemens[0].value 这样的事情，而是使用 a = 3 + Number(document.forms[0].elemens[0].value)；请注意，我不建议使用包装对象（new Number()，new String()等）。 - Christoph

除非您期望该值包含类似于“foo”的字符串，否则您不需要这样做，因为无论如何都会失败。 - scunliffe

@scunliffe：3 + 'foo' === '3foo'，而3 + Number('foo') === NaN。 - Christoph

当你需要将某些内容转换为数字时，为什么不使用parseInt呢？ - AnnanFay

@Annan: 那只是一个例子；但你说得对，我不太喜欢 parseInt() 因为它会做太多的魔术：parseInt(' 3foo') === 3；我认为明确验证用户输入（例如使用正则表达式）并使用在无效输入时干净地失败的函数更好... - Christoph

Answer 4

始终使用jslint。

一开始可能会有点沮丧，但这是有益的。

Jslint会告诉你是否违反了一个或多个“最佳实践”。

还要考虑使用支持jslint的IDE。我可以推荐WebStorm或Sublime Text 2（这两个我自己测试过，它们非常好地支持jslint）。

- Szymon Wygnański

---

我发现对于大团队来说，jshint 更实用并且更少有主观看法。 - Christopher Tokar