JavaScript 设计模式

Question

我正在使用WebSockets编写JavaScript聊天室应用程序。但是，除了这里那里的一些小jQuery代码片段外，我对JavaScript很少有经验。

我的问题是，我应该使用什么设计模式来使对象自包含，并能够创建多个实例而不干扰同一对象的其他实例？此外，我需要知道如何存储公共对象属性并在事件处理程序中访问它们，当“this”关键字指的是当前对象实例之外的其他东西时。

最好附带代码示例！

目前，我正在使用原型设计模式，它似乎可以工作，但不是很优雅...特别是在处理事件方面，是否有更好的方法？

我当前正在做类似于以下内容的事情：

function Room( args ) {
    this.container = $( '#room-' + args.id );
    this.container.find( '.someBtn' ).on( 'click', this.someEventHandler() );
}

Room.prototype.someEventHandler = function() {
    var self = this;

    return function( event ) {
        console.log( self, this, event );
    }
}

- user1960364

---

很多问题 - 你最好花几个小时阅读一本好的JS书籍，比如：http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742 - tjdecke

@tjdecke 这本书没有关于设计模式的内容。 - Esailija

为什么你还没有研究 socket.io 和 node.js 呢？有很多示例可以做这个，也有开源的示例可以回答你的问题，这样你就可以更快地前进了。这里只是其中之一 -> https://github.com/ericraio/socket.io-chat-demo - King Friday

@Esailija，虽然它不是一本关于设计模式的书，但它确实有其公平份额的代码重用模式——因此，它可能会澄清继承方面的混淆（可见性、原型继承的替代方案），这似乎是他感兴趣的。 - tjdecke

@zipstory.com 如果我表达不清楚，实际上我正在使用SmartFoxServer进行低级别的后端处理。我只是在构建演示层（可以这么说），即JS中的高级客户端应用程序，同时利用他们提供的API。我曾经考虑过使用（Backbone，Underscore，Require）.js和jQuery来制作单页应用程序，因为它完全符合我的项目需求。然而，我发现自己无法真正掌握这些概念，因为我的知识水平有限。 - user1960364

Answer 1

原型已经足够好了，对于你所描述的任务它表现得非常出色。

如果你想要更多，就不能逃避阅读 :-) 有很多设计模式可供选择，有时候更多是基于个人偏好，因为差异并不大。

这里有一篇关于模式的最佳阅读材料：JS 设计模式

还有一篇关于模块模式和 requirejs 的文章：使用模块组织代码

- Dziad Borowy

Answer 2

我建议你不要让Room自己去找元素，而是使用$.proxy

function Room( args ) {
    this.container = $( args.elem ); //elem can be selector, dom element, or another jQuery object
    this.container.find( '.someBtn' ).on( 'click', $.proxy( this.clicked, this) );
}

Room.prototype.clicked = function(event) {
    console.log( this, event.currentTarget );
}

在clicked方法中，this是房间实例，event.currentTarget是处理程序附加的元素或委托目标。参见http://api.jquery.com/event.currentTarget/ 我有一个待定的jQuery功能请求，以使上述内容更清晰http://bugs.jquery.com/ticket/12031

- Esailija

---

代理有什么优势？为什么要使用它？代理比返回匿名函数更快吗？ - user1960364

@user1960364 难道不明显吗？.clicked函数被缩减为一行代码，而在你目前的代码中它有4行。 - Esailija

不幸的是，代码行数更少并不意味着它更有效率... 我只是不想为了懒得打更少的代码而增加很多额外负担。 :) - user1960364

@user1960364 这个问题涉及设计模式，突然间你准备在各处复制代码以获取纳米级的性能优化吗？:P 不，这并不会对性能产生任何影响。它只是一个辅助函数，用于自动执行你每次手动执行的操作。 - Esailija

好的，谢谢。哈哈！我总是尽力从一开始就学习最佳实践。这才是这个话题真正关注的内容。:D 我在一个非常不完美的世界中对完美的无尽追求。lol - user1960364