使用下划线的Javascript继承

Javascript inheritance using underscore.js

本文关键字：Javascript 继承 下划线      更新时间：2023-09-26

我使用下划线。js _。创建继承实现函数，但当我尝试使用ListMakerTask_2:

ListMakerTask_2.initialize("div1", phones);
ListMakerTask_2.RenderList();

它给了我:

TypeError: ListMakerTask_2.initialize is not a function

但是当我使用ListMakerTask_1它工作得很好:

ListMakerTask_1.initialize("div1", phones);
ListMakerTask_1.RenderList();

类层次结构:

  var Abstract_ListMaker = {
    divID: null,
    arr: null,
    //Empty abstract function
    initialize: function(){},
    //Empty abstract function
    RenderList: function(){}
};
var ListMakerTask_1 =  _.create(Abstract_ListMaker.prototype,{
    initialize: function(divID, arr){
        this.divID = divID;
        this.arr = arr;
    },
    RenderList: function(){
    var out = "<ul>";
    for(var i = 0; i < this.arr.length;i++){
        out+="<li>" + this.arr[i].age +"<br>" + this.arr[i].id +"<br><img src='" + this.arr[i].imageUrl  +"'/><br>"  + this.arr[i].name + "<br>" + this.arr[i].snippet + "</li>";
    }
    out+= "</ul>";
    document.getElementById(this.divID).innerHTML = out;
}});
var ListMakerTask_2 = _.create(ListMakerTask_1.prototype, {RenderList: function(){
    var createNewUL = document.createElement("ul");
    createNewUL.id = "phoneList";
    document.getElementById(this.divID).appendChild(createNewUL);
    for(var i = 0; i < this.arr.length;i++) {
        var chunk = "<li>" + this.arr[i].age + "<br>" + this.arr[i].id + "<br><img src='"
            + this.arr[i].imageUrl + "'/><br>" + this.arr[i].name + "<br>" + this.arr[i].snippet + "</li>";
        document.getElementById("phoneList").innerHTML += chunk;
    }
}});

我发现了一个问题:

var ListMakerTask_2 =_.create(ListMakerTask_1.prototype,...);

我已经删除了.prototype，现在它工作了。

相关文章：