遍歷地圖列表以使用JS過濾地圖鍵值

Question

如何遍歷地圖列表以從下面的列表中過濾出SearchMap鍵值使用JS的具有記錄地圖的列表？

地圖

var searchMap = new Map()
searchMap.set("ed_mood", "strong")
searchMap.set("ed_target_audience", "Expert")
searchMap.set("ed_clip_type", "intro")

名單

var master_data =
[
    {ed_mood: "Light", ed_rating: 10, ed_target_audience: "Novice", ed_clip_type: "Basic"},
    {ed_mood: "Light", ed_rating: 5, ed_target_audience: "Expert", ed_clip_type: "Q&A"},
    {ed_mood: "Strong", ed_rating: 8, ed_target_audience: "Expert", ed_clip_type: "Intro"},
    {ed_mood: "Strong", ed_rating: 7, ed_target_audience: "Expert", ed_clip_type: "Q&A"},
    {ed_mood: "Strong", ed_rating: 10, ed_target_audience: "Expert", ed_clip_type: "intro"}
]

注意 ：要過濾出記錄，我使用的是AlaSql，但未給出預期的結果。 還有其他JS將地圖過濾到地圖列表的方法嗎？

var filter_result = [];
searchMap.forEach(function(value, key){
    var data  = alasql(`select * from ? where ${key} like ?`,[master_data, `%${value}%`]);
    $.each(data, (i) => filter_result.push(data[i]));
});

預期結果

[
   {ed_mood: "Strong", ed_rating: 8, ed_target_audience: "Expert", ed_clip_type: "Intro"},
   {ed_mood: "Strong", ed_rating: 10, ed_target_audience: "Expert", ed_clip_type: "intro"}
]

Answer 1

下面的代碼filters master_data只return Objects每一個匹配param在searchMap 。

有關更多信息，請參見Array.prototype.filter() ， Array.prototype.every() ， Map.entries() ， JSON.stringify()和String.toLowercase() 。

 // Search Map. const searchMap = new Map([ ['ed_mood', 'strong'], ['ed_target_audience', 'Expert'], ['ed_clip_type', 'intro'] ]) // Master Data. const master_data = [ {ed_mood: 'Light', ed_rating: 10, ed_target_audience: 'Novice', ed_clip_type: 'Basic'}, {ed_mood: 'Light', ed_rating: 5, ed_target_audience: 'Expert', ed_clip_type: 'Q&A'}, {ed_mood: 'Strong', ed_rating: 8, ed_target_audience: 'Expert', ed_clip_type: 'Intro'}, {ed_mood: 'Strong', ed_rating: 7, ed_target_audience: 'Expert', ed_clip_type: 'Q&A'}, {ed_mood: 'Strong', ed_rating: 10, ed_target_audience: 'Expert', ed_clip_type: 'intro'} ] // Output. const output = // Filter master_data for Objects that include every searchpoint. master_data.filter((datapoint) => // Destructuring assignment + Map.entries to reveal searchMap entries. [...searchMap.entries()].every((searchpoint) => // Object.entries() to reveal datapoint entries. // JSON.stringify + toLowerCase() for normalization. JSON.stringify(Object.entries(datapoint)).toLowerCase().includes(JSON.stringify(searchpoint).toLowerCase()))) // Log. console.log(output) 

Answer 2

代碼中的問題是您正在使用（隱式） OR運算符來連接條件。 您的預期結果表明您應該使用AND運算符。

您可以先構建SQL命令，然后使用AlaSQL執行它（只是一個建議，您向我介紹了AlaSQL :-)）

 var searchMap = new Map(); searchMap.set("ed_mood", "strong"); searchMap.set("ed_target_audience", "Expert"); searchMap.set("ed_clip_type", "intro"); var master_data = [ {ed_mood: "Light", ed_rating: 10, ed_target_audience: "Novice", ed_clip_type: "Basic"}, {ed_mood: "Light", ed_rating: 5, ed_target_audience: "Expert", ed_clip_type: "Q&A"}, {ed_mood: "Strong", ed_rating: 8, ed_target_audience: "Expert", ed_clip_type: "Intro"}, {ed_mood: "Strong", ed_rating: 7, ed_target_audience: "Expert", ed_clip_type: "Q&A"}, {ed_mood: "Strong", ed_rating: 10, ed_target_audience: "Expert", ed_clip_type: "intro"} ]; var command = "SELECT * FROM ? WHERE"; var values = []; searchMap.forEach(function(value, key){ command += ` ${key} LIKE ? AND`; values.push('%' + value); }); //Removing the last "AND" command = command.substring(0, command.length -4); var filter_result = alasql(command, [master_data, ...values]); console.log(filter_result); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/alasql/0.4.5/alasql.min.js"></script> 

---

不使用AlaSQL的解決方案

使用ES6，您的代碼可以是：

 var searchMap = new Map(); searchMap.set("ed_mood", "strong"); searchMap.set("ed_target_audience", "Expert"); searchMap.set("ed_clip_type", "intro"); var master_data = [ {ed_mood: "Light", ed_rating: 10, ed_target_audience: "Novice", ed_clip_type: "Basic"}, {ed_mood: "Light", ed_rating: 5, ed_target_audience: "Expert", ed_clip_type: "Q&A"}, {ed_mood: "Strong", ed_rating: 8, ed_target_audience: "Expert", ed_clip_type: "Intro"}, {ed_mood: "Strong", ed_rating: 7, ed_target_audience: "Expert", ed_clip_type: "Q&A"}, {ed_mood: "Strong", ed_rating: 10, ed_target_audience: "Expert", ed_clip_type: "intro"} ]; var filter_result = master_data.filter(function(x) { for (var [key, value] of searchMap) { //Change the comparison to fit your needs // Condition to handle null , undefined and ''(blank) values if (x[key] !== null && typeof x[key] !== 'undefined' && x[key] !== '') { if (x[key].toLowerCase() !== value.toLowerCase()) return false; } else { return false; } } return true; }); console.log(filter_result); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/alasql/0.4.5/alasql.min.js"></script> 

Answer 3

您可以在此處使用lodash的filter方法。

就您而言，您將執行以下操作：

const result = _filter(master_data, {
  ed_mood: 'strong',
  ed_target_audience: 'expert',
  ed_clip_type: 'intro'
});

在lodash / filter上閱讀有關它的更多信息