JavaScript 中介器模式;组件名称未定义

JavaScript Mediator pattern; Component name is undefined

本文关键字:组件 未定义 模式 JavaScript      更新时间:2023-09-26

在中介模式的以下实现中,为什么初始化方法中的 this.name 总是未定义?正如我期望它是测试对象一样。我怎样才能做到这一点?

另外,如何创建测试对象的新实例?

Mediator = function() {
        var debug = function() {
            // console.log or air.trace as desired
        };
        var components = {};
        var broadcast = function(event, args, source) {
            var e = event || false;
            var a = args || [];
            if (!e) {
                return;
            }
            //debug(["Mediator received", e, a].join(' '));
            for (var c in components) {
                if (typeof components[c]["on" + e] == "function") {
                    try {
                        //debug("Mediator calling " + e + " on " + c);
                        var s = source || components[c];
                        components[c]["on" + e].apply(s, a);
                    } catch (err) {
                        debug(["Mediator error.", e, a, s, err].join(' '));
                    }
                }
            }
        };
        var addComponent = function(name, component, replaceDuplicate) {
            if (name in components) {
                if (replaceDuplicate) {
                    removeComponent(name);
                } else {
                    throw new Error('Mediator name conflict: ' + name);
                }
            }
            components[name] = component;
        };
        var removeComponent = function(name) {
            if (name in components) {
                delete components[name];
            }
        };
        var getComponent = function(name) {
            return components[name] || false;
        };
        var contains = function(name) {
            return (name in components);
        };
        return {
            name      : "Mediator",
            broadcast : broadcast,
            add       : addComponent,
            rem       : removeComponent,
            get       : getComponent,
            has       : contains
        };
    }();

    // Components    
    Mediator.add('TestObject', function() {
        var someNumber = 0; // sample variable
        var someString = 'another sample variable';
        return {
            onInitialize: function() {
                // this.name is automatically assigned by the Mediator
                alert(this.name + " initialized.");
            },
            onFakeEvent: function() {
                someNumber++;
                alert("Handled " + someNumber + " times!");
            },
            onSetString: function(str) {
                someString = str;
                alert('Assigned ' + someString);
            }
        }
    }());
    Mediator.broadcast("Initialize");                 
    Mediator.broadcast('FakeEvent');                  
    Mediator.broadcast('SetString', ['test string']); 
    Mediator.broadcast('FakeEvent');                  
    Mediator.broadcast('SessionStart');

这是因为在函数块中,你要返回,this表示块本身,而不是中介器对象(你可以尝试console.log(this); onInitialize看到这一点)。

编辑

要将名称组件添加到回调中,您可以执行以下操作

var addComponent = function(varName, component, replaceDuplicate) {
    if (varName in components) {
        if (replaceDuplicate) {
            removeComponent(varName);
        } else {
            throw new Error('Mediator name conflict: ' + varName);
        }
    }
    components[varName] = component;
    components[varName].name = varName;
};

有很多名字,所以我把当地name改成了varName