面向对象的Javascript最佳实践？ [英] Object Oriented Javascript best practices?

问题描述

我发现自己在Javascript编写了一个大项目。我记得最后一个是冒险，因为hacky JS很快就变得难以理解，我希望这段代码干净。

I'm finding myself coding a big project in Javascript. I remember the last one was quite an adventure because hacky JS can quickly becomes unreadable and I want this code to be clean.

好吧，我正在使用对象构建一个lib，但有几种方法可以在JS中定义东西，这意味着在范围，内存管理，名称空间等方面产生重要影响.EG：

Well, I'm using objects to construct a lib, but there are several ways to define things in JS, implying important consequences in the scope, the memory management, the name space, etc. E.G :

• 使用 var 或不;


• 定义文件中的内容或（函数） （）{...}）（），jquery style;


• 使用此，或不;


• 使用函数myname（）或 myname = function（）;


• 定义对象正文中的方法或使用prototype;


• 等。

• using var or not;
• defining things in the file, or in a (function(){...})(), jquery style;
• using this, or not;
• using function myname() or myname = function();
• defining methods in the body of the object or using "prototype";
• etc.

那么在JS中用OO进行编码时，最佳做法是什么？

So what are really the best practices when coding in OO in JS ?

这里的学术解释确实如此。链接到书籍热烈欢迎，只要他们处理质量和稳健性。

Academic explanations really expected here. Link to books warmly welcome, as long as they deal with quality and robustness.

编辑：

得到一些阅读，但我仍然对上述问题的答案和任何最佳实践非常感兴趣。

Got some readings, but I'm still very interested in answers to the questions above and any best practices.

推荐答案

使用`var`或不

您应该使用 var 语句引入任何变量，否则它将进入全局范围。

Using `var` or not

You should introduce any variable with the var statement, otherwise it gets to the global scope.

值得一提的是，在严格模式下（use strict; ）未声明的变量赋值抛出 ReferenceError 。

It's worth mentioning that in strict mode ("use strict";) undeclared variable assignments throws ReferenceError.

目前JavaScript没有块范围。 Crockford学校教您将var语句放在函数体的开头 ，而Dojo的风格指南读取所有变量应尽可能在最小范围内声明。 （ let 声明和定义<在JavaScript 1.7中引入的/ a>不是ECMAScript标准的一部分。）

At present JavaScript does not have a block scope. The Crockford school teaches you to put var statements at the beginning of the function body, while Dojo's Style Guide reads that all variables should be declared in the smallest scope possible. (The let statement and definition introduced in JavaScript 1.7 is not part of the ECMAScript standard.)

将常用对象的属性绑定到局部变量是一种好习惯，因为它更快而不是查看整个范围链。 （参见优化用于极致性能和低内存消耗的JavaScript 。

It is good practice to bind regularly-used objects' properties to local variables as it is faster than looking up the whole scope chain. (See Optimizing JavaScript for extreme performance and low memory consumption.)

如果您不需要在代码之外访问对象，可以将整个代码包装在函数表达式中 - 它称为模块模式。它具有性能优势，并且还允许您的代码在高级别上缩小和模糊。您还可以确保它不会污染全局命名空间。 在JavaScript中包装功能还允许您添加面向方面的行为。 Ben Cherry有一个关于模块模式的深入文章。

If you don't need to reach your objects outside your code, you can wrap your whole code in a function expression—-it's called the module pattern. It has performance advantages, and also allows your code to be minified and obscured at a high level. You can also ensure it won't pollute the global namespace. Wrapping Functions in JavaScript also allows you to add aspect-oriented behaviour. Ben Cherry has an in-depth article on module pattern.

如果在JavaScript中使用伪经典继承，则可以几乎没有避免使用这个。这是你使用的继承模式的品味问题。对于其他情况，请查看Peter Michaux关于 JavaScript Widgets withoutthis的文章。

If you use pseudo-classical inheritance in JavaScript, you can hardly avoid using this. It's a matter of taste which inheritance pattern you use. For other cases, check Peter Michaux's article on JavaScript Widgets Without "this".

function myname（）是一个函数声明， myname = function（）; 是一个赋值给变量<$ c $的函数表达式C> MYNAME 。后一种形式表明函数是第一类对象，你可以对它们做任何事情，就像变量一样。它们之间的唯一区别是所有函数声明都被提升到范围的顶部，这在某些情况下可能很重要。否则他们是平等的。 function foo（）是一种简写形式。有关吊装的更多详细信息，请参阅 JavaScript范围和吊装 article。

function myname() is a function declaration and myname = function(); is a function expression assigned to variable myname. The latter form indicates that functions are first-class objects, and you can do anything with them, as with a variable. The only difference between them is that all function declarations are hoisted to the top of the scope, which may matter in certain cases. Otherwise they are equal. function foo() is a shorthand form. Further details on hoisting can be found in the JavaScript Scoping and Hoisting article.

这取决于你。 JavaScript有四种对象创建模式：伪古典，原型，功能和部分（ Crockford，2008 ）。每个都有其优点和缺点，请参阅 Crockford的视频讲座或获取他的书 The Good Parts Anon已经建议。

It's up to you. JavaScript has four object-creation patterns: pseudo-classical, prototypical, functional, and parts (Crockford, 2008). Each has its pros and cons, see Crockford in his video talks or get his book The Good Parts as Anon already suggested.

我建议您选择一些JavaScript框架，研究它们的约定和风格，并找到最适合的实践和模式您。例如， Dojo Toolkit 提供了一个强大的框架来编写面向对象的JavaScript代码，甚至支持多重继承。

I suggest you pick up some JavaScript frameworks, study their conventions and style, and find those practices and patterns that best fit you. For instance, the Dojo Toolkit provides a robust framework to write object-oriented JavaScript code which even supports multiple inheritance.

最后，有一个博客致力于探索常见的JavaScript模式和反模式。另请查看问题 JavaScript是否有任何编码标准？ 。

Lastly, there is a blog dedicated to explore common JavaScript patterns and anti-patterns. Also check out the question Are there any coding standards for JavaScript? in Stack Overflow.

这篇关于面向对象的Javascript最佳实践？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！