Part III - fetch API # 1

문제

• 체이닝의 결과가 Promise 형태로 리턴되어야 합니다
• /data/latest 의 응답 내용과 /data/weather 응답 내용을 합쳐 새로운 객체로 리턴되어야 합니다
• fetch를 활용하세요. 총 두 번 사용해야 합니다'
• Promise.all 또는 async/await을 사용하지 않고 풀어보세요

내 접근

function getNewsAndWeather() {
  // TODO: fetch을 이용해 작성합니다
  // TODO: 여러개의 Promise를 then으로 연결하여 작성합니다
  const obj = {}
  let a ;
  return fetch(newsURL)
  .then(data => data.json())
  .then(newsdata => {
    a = newsdata
    return fetch(weatherURL)
  })
    .then(data2 => data2.json())
    .then(data1 => {
      
      console.log(Object.assign( a, data1))
      console.log('a:', Object.assign( a.data, data1))
      return Object.assign( a.data, data1)
    })
    
  }

이렇게 접근했고 당연히 통과를 기대했다.

코드의 결과

결과는 이러했고, 콘솔로그의 결과는 아래와 같다.

정확한 코드

function getNewsAndWeather() {
  // TODO: fetch을 이용해 작성합니다
  // TODO: 여러개의 Promise를 then으로 연결하여 작성합니다
  const obj = {}
  return fetch(newsURL)
  .then(data => data.json())
  .then(newsdata => {
    obj.news = newsdata.data
    return fetch(weatherURL)
  })
    .then(data2 => data2.json())
    .then(weatherdata => {
      obj.weather = weatherdata
      return obj;
    })
  }

위 코드와는 다르게 , 테스트케이스 처럼 만들어주기위해 news 객체 속성값을 부여 그곳에 data를 할당하였다. 내 코드에 맞게 해설하자면, a.data이다.

테스트케이스를 보고 유심히 잘 파악 어떻게 접근하고 넣어봐야할지 생각해본 문제였다.