0

我的 FireFox 扩展的 javascript 代码包括 jquery、object 和 sort-function,如下所示:

var myModel = {
    list:[],
    anotherList:[],
    sortedList:[],//newly added propaty for newly added methods.
    sortedAnotherList:[],   //newly added propaty for newly added methods.

    getListStings: function(){
        var result      = "";
        var firstTags   = '<div class="imglist"><p class="title">List</p><div><table>';
        var lastTags    = '</table></div></div>';
        var listlength      = this.list.length;
        result += firstTags;
        for(var i=0; i<listlength; i++){
            result += "<tr><td>"+this.list[i] + "</td></tr>";
        }
        result += lastTags;
        return (result);
    },
    getSortedList: function(){//newly and tentatively added method.
        var result      = "";
        var firstTags   = '<div class="imglist"><p class="title">Sorted List</p><div><table>';
        var lastTags    = '</table></div></div>';
        var listlength      = this.sortedList.length;
        result += firstTags;
        for(var i=0; i<listlength; i++){
            result += "<tr><td>"+this.sortedList[i] + "</td></tr>";
        }
        result += lastTags;
        return (result);
    },
    sortList: function(){//newly added method.
        this.sortedList = this.list;
        this.sortedList.sort();
    },
    ...(other methods are here.)
}
var outputResult ={
    ...
}
$(function(){
    ...
    // when click-handler triggered
    myModel.sortList();
    outputResult.output(myModel.getSortedList);
    ....
});

以前它没有对数组进行排序的函数,我新添加了这个函数。首先,我在 myModel 对象中添加了 sortedList[] 属性和 sortList() 方法。

现在我遇到了一个问题。我暂时添加了获取排序结果的 getSortedList() 方法,但这显然是多余的。

如果这是其他OOP语言,我可能会使用继承,但我听说Javascript没有,我不知道如何制作和使用它们。

这种情况有什么好的解决方案? 我应该制作和使用一些继承方法,还是应该修改 getListString 来处理排序列表?

后者似乎有两个大问题,一个是维护问题。将新参数添加到 .getListStings(new argument) 以同时处理 list[] 和 sortedList[] 可能会导致使用此方法的代码的其他部分出现问题。

另一个问题是参数是“this”对象中的对象,所以,例如。对于修改“this.list.length”行,参数不能直接使用,而是需要一个新的变量和条件语句,但包含条件对OOP不利。

对此问题的任何建议,将不胜感激。

4

1 回答 1

1

首先,为了保持你的代码干净,你可以在没有继承的情况下重用代码:

var myModel = {
    list:[],
    anotherList:[],
    sortedList:[],//newly added propaty for newly added methods.
    sortedAnotherList:[],   //newly added propaty for newly added methods.

    getListStings: function(){
        return this.getListHTML('List', this.list);
    },

    getSortedList: function(){//newly and tentatively added method.
        return this.getListHTML('Sorted List', this.sortedList);
    },

    getListHTML: function (title, list) {
        var result = '<div class="imglist"><p class="title">' + title + '</p><div><table>';
        var listlength = list.length;
        for(var i=0; i<listlength; i++){
            result += "<tr><td>" + list[i] + "</td></tr>";
        }
        result += '</table></div></div>';
        return result;
    },

    sortList: function(){//newly added method.
        //If you want to keep the unsorted array you'll need to create a new array
        this.sortedList = this.list.slice();
        this.sortedList.sort();
    },
    ...(other methods are here.)
}

二、JS中存在继承,这里有一些解读:

于 2013-07-23T12:25:59.210 回答