通过JavaScript正确解释JSON数组

时间:2018-07-03 17:18:55

标签: javascript arrays json

当前能够过滤“团队”并说出是否与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样式,但我或多或少都附加了试图实现的视觉概念,因此更加注重按团队对标题进行分组。

sort by team

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

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

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

Vngeener答案每次都会重复一次团队,只需要打印一次即可。

1 个答案:

答案 0 :(得分:0)

  • 您真的不需要手动创建“ 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>'      
        );
    }
}