使用javascript进行排序和继承
Sorting and inheritance with javascript
FireFox扩展的javascript代码包括jquery、object和sort函数,如下所示:
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(新参数)中以处理list[]和sortedList[]可能会在使用此方法的代码的其他部分造成问题。
另一个问题是,参数是"this"对象中的对象,因此,ex。为了修改"this.list.length"行,参数不能直接使用,而是需要一个新的有效的条件语句,但包含条件语句对OOP不好。
对于这个问题的任何建议,我们都将不胜感激。
首先,为了保持代码的干净,您可以在没有继承的情况下重用代码:
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中存在继承,以下是一些解读:
- http://alexsexton.com/blog/2013/04/understanding-javascript-inheritance/
- http://www.klauskomenda.com/code/javascript-inheritance-by-example/
- http://davidshariff.com/blog/javascript-inheritance-patterns/
相关文章:
- JavaScript数组排序(函数)用于对表行进行排序,而不是排序
- 使用promise和mongoose对文档进行排序
- Selectize.js:如何对整数值的选项进行排序
- Javascript排序的图像弹出窗口..可以't单独弹出
- 如何通过引用var Using DataTables来进行分页或排序
- 为什么HTML5拖放的目标是孩子?(可排序列表)
- AngularJs对所有页面中的所有记录进行排序
- 从控制器继承了隔离的作用域以生成可重用的指令
- 当属性不一致时,如何根据属性对JS对象列表进行排序
- 按从高到低对多个int变量进行排序
- jQuery UI可排序-多连接列表拖动
- Javascript排序字符串或数字
- 2个backbone.js集合,具有相同的模型,但排序顺序不同
- 两个指令创建新的继承的和隔离的作用域-元素得到哪个
- sort而不是排序javascript
- 通过从节点父级获取所有子级对节点进行排序(获取子级数组)
- 如何合并不同集合的游标并按日期排序
- 为什么我的JavaScript堆栈排序函数不起作用
- ui网格:在自定义表头模板中触发排序
- 使用javascript进行排序和继承