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 );
    }
}

谢谢！

Answer 1

原型足够好，它对你所描述的任务非常有用。

如果你想要更多，你无法逃避阅读:-) 有很多设计模式，有时它更偏好，因为差异很小。

以下是关于模式的最佳读物之一：JS Design Patterns

另一个关于模块模式和requirejs：organising code using modules

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是房间实例abd event.currentTarget是处理程序附加的元素或委派的目标。见http://api.jquery.com/event.currentTarget/

我有一个针对jQuery的待处理功能请求，以使上面更清晰http://bugs.jquery.com/ticket/12031

JavaScript设计模式

2 个答案: