자바스크립트 리뷰

fetch의 활용

가문비7 2023. 3. 20. 23:17

문제점

fetch 자체를 이해하지 못했다. 

시도해 본 것

fetch() 를 인터넷에서 들여다 보았다.

fetch()는 데이터를 가져와서 클라이언트 측에서 사용할 수 있게 만드는 자바스크립트 내장함수라고 할 수 있다. 에서 사용할 수 있게 만드는 도구이다.

fetch("http://spartacodingclub.shop/sparta_api/seoulair")
          .then((res) => res.json())
          .then((data) => {
            let rows = data['RealtimeCityAir']['row']
            $('#names-q1').empty()

            rows.forEach((a) => {
              let gu_name = a['MSRSTE_NM'];
              let gu_mise = a['IDEX_MVL'];
              
              let temp_html = ``
              if (gu_mise > 40){
                temp_html = `<li class="bad">${gu_name} : ${gu_mise}</li>`
              } else {
                temp_html = `<li>${gu_name} : ${gu_mise}</li>`
              }

              $('#names-q1').append(temp_html)

            });
          });

위 코드를 간단히 보면 seoulair 정보를 담은 url을 가져와서  json 형태로 읽어 주고, 그것을 data라는 변수에 담아서 사용해 주고 있다. 

 

해결 

일단 여기까지는 이해하는데 큰 문제는 없다. 

알게 된 점

 

나머지 코드는 큰 문제 없이 이해되었다.