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

概述

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

在用户看来，每个元素应该只有一条消息。例如，如果用户一直单击某个按钮，我不想重新实例化更多消息。只需要一个

我可以做的一件事是在消息显示完成之前禁用按钮…但这不是我想要的方式

函数的作用是：在大约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' );

---

或者，您可以向元素添加自定义属性，然后在创建新消息实例时，检查是否存在该自定义属性

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

---

或者，您可以向元素添加自定义属性，然后在创建新消息实例时，检查是否存在该自定义属性

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

---

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

(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 = {...};

})();

消息

标识符是在闭包中定义的，但没有

var

关键字，因此它是全局可访问的。

messageInstances

是一个“私有”（在闭包之外不可访问）数组，用于跟踪现有实例。如果第一次为给定的

元素
调用
消息（元素）
构造函数，将创建一个新对象。如果再次调用它，将在数组中找到先前创建的实例，并返回该实例，而不是新创建的对象

请注意，在本例中，元素必须通过一些字符串属性来识别，例如
名称
您可以在闭包中定义构造函数

(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 = {...};

})();

消息
标识符是在闭包中定义的，但没有
var
关键字，因此它是全局可访问的。
messageInstances
是一个“私有”（在闭包之外不可访问）数组，用于跟踪现有实例。如果第一次为给定的
元素
调用
消息（元素）
构造函数，将创建一个新对象。如果再次调用它，将在数组中找到先前创建的实例，并返回该实例，而不是新创建的对象

请注意，在本例中，元素必须通过一些字符串属性来识别，例如类似于现有答案的
名称
，但更接近于单例的传统概念：

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

    element.messageInstance = this;

    // Remainder of your constructor logic here
};

这样，您就不必在一个集中的位置跟踪所有标记的元素，您可以调用
new Message（element）
任意次数，并确保只返回一个实例

编辑：
设置属性
是
元素
上的一种方法，专门用于处理DOM节点的属性（即
规范上的
href
），将其指定为对象属性在技术上更为正确。
类似于现有答案，但更接近于传统的单身概念：

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

    element.messageInstance = this;

    // Remainder of your constructor logic here
};

这样，您就不必在一个集中的位置跟踪所有标记的元素，您可以调用
new Message（element）
任意次数，并确保只返回一个实例

编辑：
setAttribute
是
元素
上的一种方法，专门用于处理DOM节点的属性（即
规范上的
href
），将其指定为对象属性在技术上更为正确。
您能否演示如何/在何处实例化
消息
？再次更新以使其更具可读性。是的，您需要一个数组来跟踪元素。一种方法是重构Message类，使其只实例化一次，并且单个实例将跟踪所有元素。您能否演示如何/在何处实例化
Message
？再次更新它以使其更具可读性。是的，您需要一个数组来跟踪元素。一种方法是重构Message类，这样您只需对其执行一次，并且单个实例将跟踪所有元素。这与主题无关。但请注意，要创建隐私，您必须运行匿名函数…即。这是在运行时完成的…我总是发现隐私需要运行时资源这一点很有意思。这是离题的…但要创建隐私，请注意您必须运行匿名函数…即。这是在运行时完成的…我总是发现隐私需要运行时资源这一点很有趣。问题：为什么我需要使用setAttribute…上面的示例只是直接使用添加属性。问题：为什么我需要使用setAttribute…上面的示例只是使用。运算符。为什么不使用setAttribute？…下面的示例使用setAttribute，而不是使用。运算符。对于注释来说，答案有点冗长——在上面的答案正文中有说明：）但是当属性完成时，什么会取消属性设置？您可以执行
delete element.messageInstance
以在之后删除属性。为什么不使用setAttribute？…下面的示例使用setAttribute，而不是使用。运算符。对于注释来说，答案有点冗长--在上面的答案正文中有说明：）但是当属性完成时，什么会取消属性的设置？您可以执行
delete element.messageInstance
以在之后删除属性。