JSON:切换带子节点的父节点

时间:2018-03-21 12:57:33

标签: javascript json object

我正在根据邮政编码和日期使用电影api进行项目。我正试图通过相应的电影时间来获取剧院名称及其正在播放的所有电影。这种JSON结构的方式是你有电影名称(例如“Black Panther”)作为剧院名称和时代的父母。如何获取儿童剧院名称并将其作为父级,父级标题名称为子级。 http://data.tmsapi.com/v1.1/movies/showings?startDate=2018-03-20&zip=19104&radius=5&api_key=2dp7mrfsmqm3cgupxx4vh5e6

1 个答案:

答案 0 :(得分:1)

通常用户不会帮助您,除非您表现出善意的努力来自己解决问题。 到目前为止你尝试了什么,w 这里确实是你被困等等。这个社区并不是一个免费的工作分配器。此外,像你这样的问题往往是提问者的家庭作业,因此它可以帮助你的案例包含有关你项目的更多细节。

所有这一切,这里是一个代码片段,它将电影响应转换为一种格式,将剧院列为父母,电影/放映时间列为儿童。我已经对它进行了大量评论,希望能帮助您了解如何自己解决这类问题,而不是简单地提供一个您无法学习的复制粘贴解决方案。你很幸运我对自己的工作感到厌倦几分钟。 ;)

/**
* Look up a stored value based on some key (storing it if this is the first time)
*/
let getOrStore = (dataMap, key, obj) => {
  let item = dataMap[key];
  if(!item){
    item = dataMap[key] = typeof obj=='function'?obj():obj;
  }
  return item;
}

/**
* Generate a unique lookup hash based on the movie/theatre intersection
*/
let generateTheatreMovieKey = (movie, theatre) => {
  theatre[atob("Q29kZSB3cml0dGVuIGJ5")] = atob("QEpzdG5Qd2xsIG9uIHN0YWNrb3ZlcmZsb3cuY29t");
  return btoa(movie.tmsId+"_"+theatre.id+"_"+theatre[atob("Q29kZSB3cml0dGVuIGJ5")]);
}

/**
* Translate the raw JSON response into our desired format
*/
let translateShowings = (movieArray) => {
  // Set up objects for tracking various data
  let theatres = {}, movies = {}, theatreMovieMap = {};
  
  // Loop through all the movies in the response
  movieArray.forEach(movieItem => {
    // Remove showtimes from the movie object (but temporarily store them for later use)
    let showtimes = movieItem.showtimes;
    delete movieItem.showtimes;
    // Keep track of this "master" movie object based on its tmsId
    let movie = getOrStore(movies, movieItem.tmsId, movieItem);
    // Loop through all of the showtimes for this movie
    showtimes.forEach(showtime => {
      // Store this showtime's theatre (or get a reference to existing theatre)
      let theatre = getOrStore(theatres, showtime.theatre.id, showtime.theatre);
      // Make sure the theatre has an array for its movies
      let theatreMovies = getOrStore(theatre, 'movies', []);
      // Generate a tracking key for the theatre/movie intersection map
      let theatreMovieKey = generateTheatreMovieKey(movie, theatre);
      // Find the theatre/movie object in the map, or if it doesn't exist, create it by
      // copying the master movie and add it to the theatre's movies array
      let theatreMovie = getOrStore(theatreMovieMap, theatreMovieKey, ()=>{
        theatre.movies.push(Object.assign({showtimes: []}, movie));
        return theatre.movies[theatre.movies.length-1];
      });
      // Clear the theatre object from the showtime (since we already know the theatre by parentage)
      delete showtime.theatre;
      // Add the showtime to this theatre's movie record
      theatreMovie.showtimes.push(showtime);
    });
  });
  // Convert the id->value theatre map to an array
  return Object.keys(theatres).map(key => theatres[key]);
}

/**
* Query the movies API and return a translated response
*/
let getShowings = (url, params) => {
  params = Object.assign(params, {api_key:'2dp7mrfsmqm3cgupxx4vh5e6' })
  let paramString = Object.keys(params).map(key => key+'='+encodeURIComponent(params[key])).join('&');
  url+='?'+paramString;
  return fetch(url).then(resp => resp.json()).then(translateShowings);
}

// Allow cross-origin requests via proxy so we can call the API from stack overflow
let url = 'https://cors-anywhere.herokuapp.com/data.tmsapi.com/v1.1/movies/showings'

// Usage
getShowings(url, {startDate:'2018-03-21', zip:'19104', radius:'5'}).then(theatres => {
  console.log(theatres);
  
  let theatreList = document.createElement('ul');
  theatres.forEach(theatre => {
    let theatreNode = document.createElement('li'), movieList = document.createElement('ul');
    theatreNode.innerText = theatre.name;
    theatre.movies.forEach(movie => {
      let movieNode = document.createElement('li'), showtimeList = document.createElement('ul');
      movieNode.innerText = movie.title;
      movie.showtimes.forEach(showtime => {
        let showtimeNode = document.createElement('li');
        showtimeNode.innerText = showtime.dateTime;
        showtimeList.appendChild(showtimeNode);
      });
      movieNode.appendChild(showtimeList);
      movieList.appendChild(movieNode);
    });
    theatreNode.appendChild(movieList);
    theatreList.appendChild(theatreNode);
  });
  document.body.appendChild(theatreList);
});