javascript - 使用 Javascript forEach 和 indexOf 在 JSON 中搜索多个过滤器

Question

我有 JSON 格式的数据，我需要在其中执行搜索。有不同的标签可用，当我点击它们时，它会在 JSON 中搜索并返回具有这些标签的项目。为此，我使用了一个 js 函数。它第一次正常工作，但是当我在函数中推送第二个过滤器时，它返回错误的数据。

可用的过滤器是:

绑定(bind)

• 平装本
• 精装本
• 有声读物
• 盒装套装

类别

• 经典摇滚
• 流行
• 流行摇滚
• 电子流行音乐
• 软摇滚
• 摇滚

语言

• 德语
• 英语
• 法语

作者

• 男
• 女
• 男/女

这是我使用的 JSON 和代码:

var m = {
      "Books": [{
          "title": "Book 1",
          "binding": "paperback",
          "category": "pop",
          "language": "english",
          "author": "male"
        },
        {
          "title": "Book 2",
          "binding": "hardcover",
          "category": "pop rock,electro pop",
          "language": "french",
          "author": "female"
        },
        {
          "title": "Book 3",
          "binding": "audiobook",
          "category": "soft rock",
          "language": "german",
          "author": "male,female"
        },
        {
          "title": "Book 4",
          "binding": "boxed set",
          "category": "rock,classic rock",
          "language": "english",
          "author": "female,male"
        },
        {
          "title": "Book 5",
          "binding": "paperback",
          "category": "electro pop,rock,classic rock",
          "language": "french",
          "author": "male/female"
        },
        {
          "title": "Book 6",
          "binding": "paperback",
          "category": "rock",
          "language": "french",
          "author": "male"
        }
      ]
    }


    // a function which accepts key which is one of binding,category,language,author.
    // the array will be filtered on this key
    function getFilteredElement(key, value) {
        var bookFilter = [];
        m.Books.forEach(function(item){
           var getFilterField = item[key];
           // since the value is a string, so splitting it and creating an array
           var keyArray = item[key].split(',');
           // now checking if the passed value has a presence in the  above array
           if (keyArray.indexOf(value) !== -1) {
               // if present pushed the book name
               bookFilter.push(item.title);
           }
       });
        // returning the array of books
        return bookFilter;
    }

    console.log(getFilteredElement('category', 'rock'))

例如当我按下 category = rock 时，它返回 Book 4、Book 5 和 Book 6 但如果我按下 category = rock 和 language = french，返回的结果应该只是 Book 5 但它没有返回正确的结果。

谁能帮忙。

Answer 1

您可以将对象用于过滤器，并将键作为要搜索的键，将值作为字符串的精确值。

带有逗号的属性被拆分和检查。

function getBooks(filters) {
    return array.Books.filter(function (o) {
        return Object.keys(filters).every(function (k) {
            return o[k].split(',').some(function (v) {
                return v === filters[k];
            });
        });
    });
    //.map(function (o) {
    //    return o.title;
    //});
}

var array = { Books: [{ title: "Book 1", binding: "paperback", category: "pop", language: "english", author: "male" }, { title: "Book 2", binding: "hardcover", category: "pop rock,electro pop", language: "french", author: "female" }, { title: "Book 3", binding: "audiobook", category: "soft rock", language: "german", author: "male,female" }, { title: "Book 4", binding: "boxed set", category: "rock,classic rock", language: "english", author: "female,male" }, { title: "Book 5", binding: "paperback", category: "electro pop,rock,classic rock", language: "french", author: "male/female" }, { title: "Book 6", binding: "paperback", category: "rock", language: "french", author: "male" }] };

console.log(getBooks({ category: 'rock' }));
console.log(getBooks({ category: 'rock', language: 'french' }));

.as-console-wrapper { max-height: 100% !important; top: 0; }