Question

我需要创建一个可搜索项目数组，但我不确定是应该创建一个自定义对象数组还是仅创建一个分隔字符串数组。有人可以给我一些建议，哪种方式更好。以下是一个例子：

var Arr = [  "Arts Tower|ArtsTower.htm|104", 
             "Arts Tower|ArtsTower.htm|1203", 
             "Arts Tower|ArtsTower.htm|Arts Tower"
          ];

var searchTerm = "tow"

var ArrResults = jQuery.grep(Arr, function(value, index){
 return (value.split("|")[2].toLowerCase().indexOf(searchTerm) != -1);
});

或

function Item(name, url, str){
  this.name = name;
  this.url = url;
  this.str= str;
}

var Arr = new Array();
Arr.push(new Item("Arts Tower", "ArtsTower.htm", "104"));
Arr.push(new Item("Arts Tower", "ArtsTower.htm", "1203"));
Arr.push(new Item("Arts Tower", "ArtsTower.htm", "Arts Tower"));

var searchTerm = "tow"

var ArrResults = jQuery.grep(Arr, function(value, index){
  return (value.str.toLowerCase().indexOf(searchTerm) != -1);
});

我需要搜索数组并返回任何匹配项。哪个会表现更好？

Answer 1

使用数组和对象构造函数并将项目推送到数组是一种过度杀伤（对于像您这样的静态数据而言是不必要的）。

使用需要额外处理来解析的专有编码（使用管道分隔符）也是不利的。

我会使用文字形式的对象数组：

var Arr = [
    { name: "Arts Tower", url: "ArtsTower.htm", str: "104" },
    { name: "Arts Tower", url: "ArtsTower.htm", str: "1203" },
    { name: "Arts Tower", url: "ArtsTower.htm", str: "Arts Tower" }
];

这也使您更接近希望通过XHR（$ .ajax）加载数据的位置。

Answer 2

我不知道你的哪个建议更快，但我个人会使用第二个例子。这是因为您以后使用了您的ArrResults arary。如果该数组包含字符串，则每次使用其中一个结果时都必须将其拆分，如下所示：ArrResults[0].split('|')[0]而不仅仅是ArrResults[0].name

对象数组与分隔字符串数组的数组

2 个答案: