Javascript 使用 jQuery 从 JSON 数组中获取唯一结果
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6680430/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get unique results from JSON array using jQuery
提问by JFFF
I have this block of code that displays the "categories" from my array into a JQuery simple list.
我有这段代码将数组中的“类别”显示到 JQuery 简单列表中。
It works fine, but if there are 3 items from the category "basketball", the category will appear 3 times.
它工作正常，但如果“篮球”类别中有 3 个项目，则该类别将出现 3 次。
How could I make it so they only appear once ? Thank you.
我怎么能让它们只出现一次？谢谢你。
Here's the code :
这是代码：
function loadCategories() {
console.debug('About to refresh with sort type : ' + sortType);
var items = [];
$.each(catalog.products,
function(index, value) {
items.push('<li id="' + index + '">' +
'<a data-identity="productId" href="./productList.page?category=' + value.category + '" >' +
'<p style="margin-bottom:0px;margin-top:0px;">' + value.category + '</p></a> </li>');
}
);
categoryView.html(items.join(''));
categoryView.listview('refresh');
}
Here's the code for my array :
这是我的数组的代码：
var catalog = {"products": [
{"id": "10001",
"name": "Mountain bike",
"color": "Grey/Black",
"long-desc": "12-speed, carbon mountain bike.",
"description": "",
"size": "20 inches",
"category": "Outdoors/ Equipment rental",
"sport": "Cycling",
"brand": "DaVinci",
"top-seller": ""},
{"id": "10002",
"name": "Pro Multi Basketball",
"color": "Rainbow",
"long-desc": "On sale this week only! This limited edition basketball is multi-coloured, and offers pro performance. Fun and games on the court!",
"description": "Limited edition basketball.",
"size": "N/A",
"category": "Team gear",
"sport": "Basketball",
"brand": "Nike",
"top-seller": "x"},
回答by kapa
I don't know how your productsarray is built up (so my example might need some modification according to your needs), but you could write a little piece of code that will first collect your unique categories into a new array:
我不知道您的products数组是如何构建的（因此我的示例可能需要根据您的需要进行一些修改），但是您可以编写一小段代码，首先将您的唯一类别收集到一个新数组中：
var categories = [];
$.each(catalog.products, function(index, value) {
if ($.inArray(value.category, categories) === -1) {
categories.push(value.category);
}
});
categorieswill hold the unique categories you need, you can use it to build your HTML from that (be careful with the IDs of those lielements though, remember that IDs cannot be duplicate, you might give them a little prefix).
categories将保存您需要的唯一类别，您可以使用它来构建您的 HTML（li不过请注意这些元素的 ID ，请记住 ID 不能重复，您可以给它们一个前缀）。
回答by Vadim Gremyachev
How to get unique values by property
如何按属性获取唯一值
function groupBy(items,propertyName)
{
var result = [];
$.each(items, function(index, item) {
if ($.inArray(item[propertyName], result)==-1) {
result.push(item[propertyName]);
}
});
return result;
}
Usage
用法
var catalog = { products: [
{ category: "Food & Dining"},
{ category: "Techonology"},
{ category: "Retail & Apparel"},
{ category: "Retail & Apparel"}
]};
var categoryNames = groupBy(catalog.products, 'category');
console.log(categoryNames);
回答by Parth Raval
var catalog={
products : [
{ category: 'fos', name: 'retek' },
{ category: 'fos', name: 'item' },
{ category: 'nyedva', name: 'blabla' },
{ category: 'fos', name: 'gihi' },
]
};
console.log(_.uniq(_.map(catalog.products, 'category')));<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.js"></script>Use _uniq
使用_uniq
