javascript - 单个脚本文件中的两个原型引发了问题

Question

我已经定义了两个原型，每个原型都包含不同的功能。

var sfSvgRender = function (element) {

    this.svgLink = "http://www.w3.org/2000/svg";
    this.svgObj = document.createElementNS(this.svgLink, "svg");
    this._rootId = $(element).attr("id");
    this.svgObj.setAttribute('id', this._rootId + '_svg');

};
sfSvgRender.prototype = new (function () {
    this.drawPath = function (options, element) {
        var path = document.createElementNS(this.svgLink, "path");
        $(path).attr(options);
        $(path).appendTo(element);

    },

})();


var sfAxisRender = function (axis) {
    this.currentAxis = axis;
};
sfAxisRender.prototye =new(function(){

    this.drawText=function (options, label, groupEle, svgObj) {
        var text = document.createElementNS(this.svgLink, "text");
        $(text).attr(options);
        $(text).html(label);
        $(text).appendTo(groupEle);
        $(groupEle).appendTo(svgObj);

    }

})();

当我为两个对象创建实例时，第一个对象将正常工作（即我们可以访问第一个原型的方法）

但无法访问第二个原型的方法。

this.svgRenderer = new sfSvgRender(this.element);

this.axisRender=new sfAxisRender(XAxis);

this.svgRenderer 工作正常。但axisRender 不能正常工作。

Answer 1

您拼写错误prototype为prototyeon sfAxisRender，这就是为什么它不会从您尝试分配的新原型实例继承。

function sfSvgRender(element) {
    this.svgLink = "http://www.w3.org/2000/svg";
    this.svgObj = document.createElementNS(this.svgLink, "svg");
    this._rootId = $(element).attr("id");
    this.svgObj.setAttribute('id', this._rootId + '_svg');
}
sfSvgRender.prototype.drawPath = function (options, element) {
    var path = document.createElementNS(this.svgLink, "path");
    $(path).attr(options);
    $(path).appendTo(element);
};

function sfAxisRender(axis) {
    this.currentAxis = axis;
}
sfAxisRender.prototype.drawText = function (options, label, groupEle, svgObj) {
    var text = document.createElementNS(this.svgLink, "text");
    $(text).attr(options);
    $(text).html(label);
    $(text).appendTo(groupEle);
    $(groupEle).appendTo(svgObj);
};