0

嗨，我对 javascript 很陌生。我的任务是创建一个 javascript 框架来加载多个电子学习模块并让它们通过 xml 相互交互。

我正在使用如下所示的继承方法。

基类 EventDispatcher：

(function (window) {
    var EventDispatcher = function () {
            this._listeners = [];
        }
    var p = EventDispatcher.prototype;
    p._listeners = [];
    p.addListener = function (type, listener, scope) {
        scope = (typeof scope !== "undefined") ? scope : this;
        if (typeof this._listeners[type] == "undefined") {
            this._listeners[type] = [];
        }
        this._listeners[type].push({
            listener: listener,
            scope: scope
        });
    }
    p.removeListener = function (type, listener) {
        if (this._listeners[type] instanceof Array) {
            var listeners = this._listeners[type];
            for (var i = 0, len = listeners.length; i < len; i++) {
                if (listeners[i].listener === listener) {
                    listeners.splice(i, 1);
                    break;
                }
            }
        }
    }
    p.dispatchEvent = function (event) {
        if (typeof event == "string") {
            event = {
                type: event
            };
        }
        if (!event.target) {
            event.target = this;
        }
        if (!event.type) {
            throw new Error("Event object missing 'type' property.");
        }
        if (this._listeners[event.type] instanceof Array) {
            var listeners = this._listeners[event.type];
            for (var i = 0, len = listeners.length; i < len; i++) {
                listeners[i].listener.call(listeners[i].scope, event);
            }
        }
    }
    window.EventDispatcher = EventDispatcher;
}(window));

继承 EventDispatcher 的 Sub XMLLoader 类：

(function (window) {
    var XMLLoader = function () {}
    var p = XMLLoader.prototype = new EventDispatcher();
    p.xmlhttp = null;
    p.loadXML = function (url) {
        if (this.xmlhttp == null) {
            this.initXMLHttpRequest();
        }
        this.xmlhttp.open("GET", url, true);
        this.xmlhttp.send();
    }
    p.initXMLHttpRequest = function () {
        var currObj = this;
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            this.xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        this.xmlhttp.onreadystatechange = function () {
            var xmlLoaderEvent = null;
            if (currObj.xmlhttp.readyState == 4 && currObj.xmlhttp.status == 200) {
                xmlLoaderEvent = new XMLLoaderEvents();
                xmlLoaderEvent.type = XMLLoaderEvents.XML_DOC_SUCCESS;
                xmlLoaderEvent.data = {
                    xmlDoc: currObj.xmlhttp.responseXML,
                    xmlString: currObj.xmlhttp.responseText
                };
            } else if (currObj.xmlhttp.status == 404) {
                xmlLoaderEvent = new XMLLoaderEvents();
                xmlLoaderEvent.type = XMLLoaderEvents.XML_DOC_ERROR;
            }
            if (xmlLoaderEvent != null) {
                currObj.dispatchEvent(xmlLoaderEvent);
            }
        };
    }
    /*p.onReadyStateChange = function()
    {
        var xmlLoaderEvent = null;
        if(this.xmlhttp.readyState == 4 && this.xmlhttp.status == 200)
        {
            xmlLoaderEvent = new XMLLoaderEvents();
            xmlLoaderEvent.type = XMLLoaderEvents.XML_DOC_SUCCESS;
            xmlLoaderEvent.data = this.xmlhttp.responseXML;
        }
        else if(this.xmlhttp.status == 404)
        {
            xmlLoaderEvent = new XMLLoaderEvents();
            xmlLoaderEvent.type = XMLLoaderEvents.XML_DOC_ERROR;
        }

        if (xmlLoaderEvent != null)
        {
            this.dispatchEvent(xmlLoaderEvent);
        }
    }*/
    window.XMLLoader = XMLLoader;
}(window));

现在我在另一个类中多次调用 xmlLoader。在每次我使用new XMLLoader();. 我的理解是这应该创建一个新实例并且this._listeners在基类中应该是[]空的。但这并没有发生。请帮助我并告诉我哪里出错了。

4

1 回答 1

1

在 javascript 中模拟时，类继承不能像往常一样工作。例如，没有隐式的超类构造函数调用。

您不会在“子类构造函数”中调用“母类”构造函数。这就是未初始化“母类”字段的原因。

代替

var XMLLoader = function () {}

你应该写的是

var XMLLoader = function () {
    EventDispatcher.apply(this, arguments); /* this is a common way to execute
       the code of the "mother class" "constructor" with the same "this" */
}
于 2012-05-28T11:47:48.320 回答