首页 > 解决方案 > 我怎样才能得到json数据的下一个值

问题描述

var data = [
   {
      "season": 1,
      "episode": 1,
      "name": "x series 1. season 1. episode",
   },
   {
      "season": 1,
      "episode": 2,
      "name": "x series 1. season 2. episode",
   },
   {
      "season": 1,
      "episode": 3,
      "name": "x series 1. season 3. episode",
   },
   {
      "season": 2,
      "episode": 1,
      "name": "x series 2. season 1. episode",
   },
]

例如,如果选择的第 1 季是第 2 集,我怎样才能得到之后的第 1 季第 3 集,然后下一个?我怎样才能为此编写一个函数?

var current = data[1];

console.log(current) // 1st season 2nd episode

/*
episode: 2
name: "x series 1. season 2. episode"
season: 1
*/

我想获取当前第 1 季第 3 集数据的下一个数据

标签: javascript

解决方案


我用 HTML 重现了你的情况。您必须跟踪当前选定的对象并执行下一个操作。尝试这个-

var data = [
   {"season": 1,"episode": 1,"name": "x series 1. season 1. episode",},
   {"season": 1,"episode": 2,"name": "x series 1. season 2. episode",},
   {"season": 1, "episode": 3, "name": "x series 1. season 3. episode",},
   {"season": 2, "episode": 1, "name": "x series 2. season 1. episode"},
];

const showEl = document.getElementById('show');
const nextEl = document.getElementById('next');

// Assume the season 1 episode 1 is the initial item.
let current = {season: 1, episode: 1};

// Attach the click event listener to the next button.
nextEl.addEventListener('click', () => {
  goToNext();
});

// Show the episode name to the show element.
function show(serial) {
  const _show = data.find(item => item.season === serial.season && item.episode === serial.episode);
  showEl.innerHTML = _show.name;
}

// Initially show the season 1 episode 1 item.
show(current);

// Go to the next episode function.
function goToNext() {
  const {season, episode} = current;
  
  // Check if the next episode of the current season exists or not.
  let nextItem = data.find(item => item.season === season && item.episode === episode + 1);

  // If the next episode of the current season not found then check the next season's
  // episode 1
  if (!nextItem) {
    nextItem = data.find(item => item.season === season + 1 && item.episode === 1);
  }
  
  // If item found then update the current item to the next episode item.
  // And show the current episode.
  if (!!nextItem) {
    current = nextItem;
    show(current);
  }
}
<div id="show"></div>
<button id="next">Next</button>


推荐阅读