对象数组 vs 分隔字符串数组答案

【问题标题】：array of objects vs array of delimited array of strings对象数组 vs 分隔字符串数组
【发布时间】：2011-03-15 11:43:36
【问题描述】：

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

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);
});

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

【问题讨论】：

据我所见，性能几乎相同 - 只有数百万个项目您会注意到任何差异。除了性能，第二种方法更优雅，所以我建议使用它。

标签： javascript jquery arrays

【解决方案1】：

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

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

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

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) 加载数据的点。

【讨论】：

好的听起来不错。我正在从页面上的元素中获取要加载的数据。我如何将值加载到对象字面量数组中？
双引号属性名称（使其成为有效的 JSON）并将 var Arr = 之后的位填充到服务器上的文件中，然后通过 $.getJSON() 获取它就足够了。跨度>
@Richard - “动态”从哪里来？
它的所有客户端。这些值来自图像地图的区域元素
+1 我也会选择一组对象。对象属性访问将比字符串操作更快。

【解决方案2】：

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

【讨论】：