Question

概述

这是我的消息对象。我只希望每个元素允许一个对象。评论中提到的要素。

当用户看到它时，每个元素应该只有一条消息。如果用户继续单击按钮，例如我不想重新实例化更多消息。只需要一个。

我可以做的一件事是禁用按钮，直到消息显示结束......但这不是我想要的方式。

Effects.fade（）函数在大约4秒后淡出消息。

问题吗

如何修改它，以便每个元素只允许一个自身实例？

对象

/**
 *    Message
 */

var Message = function( element ) 
{
    // need only single instance per element..so a singleton pattern per element
    this.element = element;  // This is element where the message is sent
};

Message.prototype.messages = 
{ 
    name:       'Please enter a valid name',
    email:      'Please enter a valid email',
    pass:       'Please enter passoword, 6-40 characters',
    url:        'Please enter a valid url',
    title:      'Please enter a valid title',
    tweet:      'Please enter a valid tweet',
    empty:      'Please complete all fields',
    same:       'Please make emails equal',
    taken:      'Sorry, that email is taken',
    validate:   'Please contact <a class="d" href="mailto:me@host.com">support</a> to reset your password',
};

Message.prototype.display = function( type ) 
{
    Control.send( this.element, this.messages[ type ] );
    var EffectsObject = new Effects( this.element );
    EffectsObject.fade( 'down', 4000);
};

使用对象

this.message_object = new Message( this.response_element );
this.message_object.display( 'empty' );

Answer 1

与现有答案类似，但更多的是传统的单身概念：

Message = function(element) {
    if (element.hasOwnProperty("messageInstance")) {
        return element.messageInstance;
    }

    element.messageInstance = this;

    // Remainder of your constructor logic here
};

通过这种方式，您无需在集中位置跟踪所有已标记的元素，也可以根据需要多次调用new Message(element)，并确保只返回一个实例

编辑：setAttribute是Element上专门用于处理DOM节点属性的方法（即href上<a>的内容} tag或id on，以及几乎任何东西。

相比之下，点表示法或等效括号表示法（element['messageInstance']）在任意JavaScript对象上设置属性。这两种方法都可行，但由于 messageInstance 在技术上不是根据（X）HTML规范的合法属性，因此将其指定为对象属性在技术上更正确。

Answer 2

或者你可以为元素添加自定义属性，然后创建一个新的Message实例，检查是否有自定义属性

Message = function( element ) 
{
    if ( !element.getAttribute("messageInstance")  ){
        // need only single instance per element..so a singleton pattern per element
        this.element = element;  // This is element where the message is sent
        element.setAttribute("messageInstance" , "true");
    } else {
        throw new Error ( "one elem one instance");
    }
};

Answer 3

您可以在闭包中定义构造函数。

(function () {
    var messageInstances = {};

    Message = function(element) {
        if (messageInstances[element.name])
            return messageInstances[element.name];

        this.element = element;

        messageInstances[element.name] = this;
    }

    Message.prototype.messages = {...};
    Message.prototype.display = {...};

})();

Message标识符在闭包内定义，但没有var关键字，因此可以全局访问。 messageInstances是一个“私有”（在闭包之外无法访问）数组，用于跟踪现有实例。如果第一次为给定的Message(element)调用element构造函数，则会创建一个新对象。如果再次调用它，则会在数组中找到先前创建的实例，而不是新创建的对象。

请注意，在此示例中，必须通过某些字符串属性来识别元素，例如name。

如何实现每个元素的单例？

3 个答案: