通过JavaScript正确解释JSON数组

Question

当前能够过滤“团队”并说出它是否与x匹配，然后显示与其关联的所有内容。 问题是方法通过硬编码搜索团队类别名称，但是需要它能够以编程方式说出，从而对每个唯一的团队类型进行排序。

正如您在下面看到的那样，当我的解决方案仅可以用一种面向对象的方法覆盖时，它需要三条语句。

$('#jobs-container .jobs-list').append(
  '<div id="teamtop"><span>Legal</span></div>');

for (i = 0; i < _data.length; i++) {
  for (j = 0; j < _data[i].postings.length; j++) {
    var posting = _data[i].postings[j]
    var title = posting.text
    var description = posting.description
    //Making each job description shorter than 250 characters
    var shortDescription = $.trim(description).substring(0, 250)
      .replace('\n', ' ') + "...";
    var location = nullCheck(posting.categories.location);
    var locationCleanString = cleanString(location);
    var commitment = nullCheck(posting.categories.commitment);
    var commitmentCleanString = cleanString(commitment);
    var team = nullCheck(posting.categories.team);
    var teamCleanString = cleanString(team);
    var link = posting.hostedUrl + leverParameter;

    if (team == "Legal") {
      $('#jobs-container .jobs-list').append(
        '<div class="job ' + teamCleanString + ' ' + locationCleanString + ' ' + commitmentCleanString + '">' +
        '<a class="job-title" href="' + link + '"">' + title + '</a>' +
        '</div>'
      );
    }
  }
}

$('#jobs-container .jobs-list').append(
  '<div id="teamtop"><span>Engineering</span></div>');

for (i = 0; i < _data.length; i++) {
  for (j = 0; j < _data[i].postings.length; j++) {
    var posting = _data[i].postings[j]
    var title = posting.text
    var description = posting.description
    //Making each job description shorter than 250 characters
    var shortDescription = $.trim(description).substring(0, 250)
      .replace('\n', ' ') + "...";
    var location = nullCheck(posting.categories.location);
    var locationCleanString = cleanString(location);
    var commitment = nullCheck(posting.categories.commitment);
    var commitmentCleanString = cleanString(commitment);
    var team = nullCheck(posting.categories.team);
    var teamCleanString = cleanString(team);
    var link = posting.hostedUrl + leverParameter;

    if (team == "Engineering") {
      $('#jobs-container .jobs-list').append(
        '<div class="job ' + teamCleanString + ' ' + locationCleanString + ' ' + commitmentCleanString + '">' +
        '<a class="job-title" href="' + link + '"">' + title + '</a>' +
        '</div>'
      );
    }
  }
}

$('#jobs-container .jobs-list').append(
  '<div id="teamtop"><span>Operations</span></div>');

for (i = 0; i < _data.length; i++) {
  for (j = 0; j < _data[i].postings.length; j++) {
    var posting = _data[i].postings[j]
    var title = posting.text
    var description = posting.description
    //Making each job description shorter than 250 characters
    var shortDescription = $.trim(description).substring(0, 250)
      .replace('\n', ' ') + "...";
    var location = nullCheck(posting.categories.location);
    var locationCleanString = cleanString(location);
    var commitment = nullCheck(posting.categories.commitment);
    var commitmentCleanString = cleanString(commitment);
    var team = nullCheck(posting.categories.team);
    var teamCleanString = cleanString(team);
    var link = posting.hostedUrl + leverParameter;

    if (team == "Operations") {
      $('#jobs-container .jobs-list').append(
        '<div class="job ' + teamCleanString + ' ' + locationCleanString + ' ' + commitmentCleanString + '">' +
        '<a class="job-title" href="' + link + '"">' + title + '</a>' +
        '</div>'
      );
    }
  }
}

我试图为团队中的每个人做一个工作，但努力输出正确：

for(i = 0; i < team.length; i++) {
  alert ("output only teams once"+team);
}

尽管目前没有必要使用CSS样式，但我或多或少都附有试图实现的视觉概念，因此更加着重于按团队对标题进行分组。

所以我们得到了正确的输出，例如

Legal
Corporate Associate
Corporate Paralegal
Junior Corporate Associate, Blockchain
Junior Corporate Associate, Emerging Growth
Legal Document Specialist
Regulatory & Compliance Counsel

但是我们正在手动匹配法律，只想筛选每个团队并查看。

Vngeener回答每次都重复团队，只需要打印一次团队即可。

Answer 1

• 您实际上并不需要手动创建“ Teamtop” div。
• 您创建的for循环应处理该问题。
• 并且您不需要每个团队标题都重复的循环代码。
• 并且在循环中不需要“团队”条件。

编写代码的方式没有正确利用for循环功能。

尝试用下面给出的代码替换您的代码（仅一次，请勿在多个条件下重复此代码）：

var teamAdded = [];
for(i = 0; i < _data.length; i++) {
    for (j = 0; j < _data[i].postings.length; j ++) {
        var posting = _data[i].postings[j] 
        var title = posting.text
        var description = posting.description  
        //Making each job description shorter than 250 characters
        var shortDescription = $.trim(description).substring(0, 250)
        .replace('\n', ' ') + "...";
        var location = nullCheck(posting.categories.location);
        var locationCleanString = cleanString(location);
        var commitment = nullCheck(posting.categories.commitment);
        var commitmentCleanString = cleanString(commitment);
        var team = nullCheck(posting.categories.team);
        var teamCleanString = cleanString(team);
        var link = posting.hostedUrl+leverParameter;

        //Add Team top heading dynamically
        if (!teamAdded[team]){
            $('#jobs-container .jobs-list').append(
            '<div id="teamtop"><span>'+ team +'</span></div><div id="team-children"  data-team="'+ team +'"></div>');
            teamAdded[team] = true;
        }
        // team condition was not required here
        // if(team=="Legal"){

        $('[data-team="'+ team +'"]').append(
        '<div class="job '+teamCleanString+' '+locationCleanString+' '+commitmentCleanString+'">' +
        '<a class="job-title" href="'+link+'"">'+title+'</a>' +        
        '</div>'      
        );
    }
}