javascript - 查询 JSON 对象值中的 JSON 数组

Question

我正在尝试使用 jsonSelect 插件进行查询选择，如下所示。我正在展示 this example .

如何检索所有Project 和Contractors 在“North”ProjectArea 中有项目？我已经试过这个来获取承包商的名字，但没有成功

var contractors = [{
    "contractor1": [{
                     "project": "Project 2",
                     "projectArea": "South"
                    },
                    {
                     "project": "Project 101",
                     "projectArea": "East"
                    }],
     "contractor2": [{
                     "project": "Project 500",
                     "projectArea": "North"
                     },  
                     {
                     "project": "Projetc 108",
                     "projectArea": "West"
                    }]
}]

var stringSelect = 'has(:root > .projectArea:val("North"))';
JSONSelect.forEach(stringSelect, contractors, function (resultObj) {
    $('body').append('<p>' + resultObj + '</p>');
});

Answer 1

我认为您能够实现您想要的唯一方法是更改​​您的 JSON 数据结构。具体来说，您将承包商的姓名作为键(“contractor1”、“contractor2”)，但它们实际上应该是值。您正在使用的库返回一组对象，但我看不出有任何方法可以后退一个级别并获取每个对象的相应键。我建议像这样构建您的数据:

var contractors = [
    {
        "name": "contractor1",
        "projects": [
            { "project": "Project 2", "projectArea": "South" },
            { "project": "Project 101", "projectArea": "North" }
        ]
    },
    {
        "name": "contractor2", 
        "projects": [
            { "project": "Project 500", "projectArea": "North" },
            { "project": "Project 108", "projectArea": "West" }
         ]
    }
];

此外，我认为您必须应用两级过滤器，首先是获取承包商，其次是获取每个承包商的项目:

JSONSelect.forEach('object:has(.projects:has(.projectArea:val("North")))', contractors, function (contractor) {
    $('body').append('<p>' + contractor.name + '</p>');
    JSONSelect.forEach('object:has(.projectArea:val("North"))', contractor.projects, function (project) {
        $('body').append('<p>' + project.project + '</p>'); 
    });
});

我不知道有任何其他插件可以做到这一点。如果我遇到这个问题，我的第一 react 是使用 jQuery 的 $.map 和 $.grep 方法来解决它:

var filtered = $.map(contractors, function (contractor) {
    var filteredProjects = $.grep(contractor.projects, function (project) {
        return project['projectArea'] === 'North';
    });
    if (filteredProjects.length) {
        return { 
            'name': contractor.name, 
            'projects': filteredProjects
        };
    }
});

我正在使用 $.grep 将每个承包商的项目过滤为仅包含 ['projectArea'] === 'North' 的项目。如果承包商有任何与过滤器匹配的项目，一个带有承包商名称的新对象和过滤后的项目将添加到我的 filtered 变量中。