面向对象的Javascript最佳实践？

Question

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

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

• 使用var与否;
• 在文件中或在(function(){...})()jquery样式中定义事物;
• 使用this或不使用;
• 使用function myname()或myname = function();
• 定义对象主体中的方法或使用"原型";
• 等等

那么在JS中用OO编码时,最佳实践是什么？

学术解释在这里真的很期待.链接到书籍热烈欢迎,只要他们处理质量和稳健性.

编辑:

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

Answer 1

使用`var`或不使用

您应该在var语句中引入任何变量,否则它将进入全局范围.

值得一提的是,在严格模式下("use strict";)未声明的变量赋值抛出ReferenceError.

目前JavaScript没有块范围.Crockford学校教你将var语句放在函数体的开头,而Dojo的样式指南则读取所有变量应该在尽可能小的范围内声明.(JavaScript 1.7中引入的let声明和定义不是ECMAScript标准的一部分.)

将常规使用的对象属性绑定到局部变量是一种好习惯,因为它比查找整个范围链更快.(请参阅优化JavaScript以获得极高的性能和低内存消耗.)

定义文件中的内容,或者在`(function(){...})()`中定义

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

使用`this`或不使用

如果在JavaScript中使用伪经典继承,则很难避免使用this.这是你使用的继承模式的品味问题.对于其他情况,请查看Peter Michaux关于JavaScript Widgets的文章,不要使用"this".

使用`function myname()`或`myname = function();`

function myname()是一个函数声明,myname = function();是一个赋给变量的函数表达式myname.后一种形式表明函数是第一类对象,你可以对它们做任何事情,就像变量一样.它们之间的唯一区别是所有函数声明都被提升到范围的顶部,这在某些情况下可能很重要.否则他们是平等的.function foo()是一种速记形式.有关提升的更多详细信息,请参阅JavaScript范围和提升文章.

在对象体中定义方法或使用"原型"

由你决定.JavaScript有四种对象创建模式:伪古典,原型,功能和部分(Crockford,2008).每个都有它的优点和缺点,在他的视频讲座中看到Crockford,或者得到他的书" The Good Parts as Anon"已经提出过.

构架

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

模式

最后,有一个博客致力于探索常见的JavaScript模式和反模式.另请查看问题JavaScript是否有编码标准？在Stack Overflow中.

Answer 2

自从我问这个问题以来,我将写下我阅读或提交的一些内容.因此阅读它的人不会感到沮丧,因为大多数答案都是RTMF的伪装(即使我必须承认,建议的书很好).

Var用法

任何变量都应该在JS的较高范围内声明.因此,当您需要一个新变量时,请声明它以避免在不注意它的情况下操纵全局变量等意外情况.因此,始终使用var关键字.

在对象make中,将变量设为var.如果您只想声明一个公共变量,请使用this.my_var = my_value这样做.

声明方法

在JS中,它们有很多种方法来声明方法.对于OO程序员,最自然而有效的方法是使用以下语法:

在物体内部

this.methodName = function(param) {

/* bla */

};

有一个缺点:由于有趣的JS范围,内部函数将无法访问"this".Douglas Crockford建议使用名为"that"的传统局部变量来绕过此限制.所以它变成了

function MyObject() {

    var that = this;

    this.myMethod = function() {

        jQuery.doSomethingCrazy(that.callbackMethod);

    };

};

不要依赖自动终端

;如果你忘了它,JS会尝试在行尾自动添加.不要依赖这种行为,因为你会得到一些乱七八糟的错误来调试.

Answer 3

首先应该阅读有关基于原型的编程,以便了解您正在处理的是什么样的野兽,然后在MDC的MDC和JavaScript页面上查看JavaScript样式指南.我也发现最好用工具强制代码质量,即.JavaScript Lint或其他变体.

OO的最佳实践听起来更像是想要找到模式而不是专注于代码质量,所以看看Google搜索:javascript模式和jQuery模式.

• 加快您的JavaScript速度

Answer 4

您可能想要查看John Resig(jQuery)的JavaScript Ninja的秘密."本书旨在培养一名中级JavaScript开发人员,并从现场开始,为他提供创建跨浏览器JavaScript库所需的知识."

该草案可通过出版商获取:http: //www.manning.com/resig/

Douglas Crockford在他的主页上也有一些不错的JavaScript文章:http: //www.crockford.com/

Answer 5

我经常觉得这里唯一一个使用MooTools为我的javascript的人.

它代表M y O bject O riented Tools,mootools.

我真的很喜欢他们在javascript中对OOP的看法.您也可以将它们的类实现与jquery一起使用,因此您不必抛弃jquery(尽管mootools也是如此).

无论如何,给第一个链接一个很好的阅读,看看你的想法,第二个链接是mootools文档.

MooTools和继承

MooTools课程