본문 바로가기
  • soldonii's devlog

비동기3

200118(토) : 비동기 - 콜백과 프라미스 1. 비동기 프로그램에서 '지금'에 해당되는 부분과 '나중'에 해당되는 부분 사이의 관계가 비동기 프로그램의 핵심이다. '나중'은 '지금'의 직후를 의미하지 않는다!(즉, 코드에서 '지금' 요청을 보내자마자 바로 응답을 받아서 실행할 수 있지 않다!) AJAX로 예를 들자면, AJAX는 비동기적으로 '지금' 요청하고, '나중'에 결과를 받는다. '지금'부터 '나중'까지 "기다리는" 가장 간단한 방법은 '콜백 함수'라는 장치를 이용하는 것이다. const data = ajax("http://some.url.1"); console.log(data); // data 변수에 원하는 값은 담겨있지 않다! ajax("http://some.url.1", function cbFunc(data) { console.log.. 2020. 1. 18.
비동기로 작동하는 setState 이해하기 *Udemy의 "Complete React Developer in 2020" 강의에서 학습한 내용을 정리한 포스팅입니다. *자바스크립트와 리액트를 배우는 단계라 오류가 있을 수 있습니다. 틀린 내용은 댓글로 말씀해주시면 수정하겠습니다. 감사합니다. :) 1. 비동기로 작동하는 setState 메소드 import React, { Component } from 'react'; import logo from './logo.svg'; import './App.css'; class App extends Component { constructor() { super(); this.state = { meaningOfLife: 47 } } render() { return ( {this.state.meaningOfLife.. 2019. 12. 11.
191120(수) : response 순서대로 가져오기 등 1. Response 순서대로 가져오기 바닐라코딩 어드미션 테스트 합격 후 추가과제로 받은 Hacker News API를 이용하여 Hacker News website 카피하기 과제를 며칠 붙잡고 헤맸다. 다른 부분은 큰 문제는 없었는데, 제이쿼리를 이용해 비동기로 데이터를 요청한 후, 요청한 순서대로 데이터를 받아서 DOM에 추가해야 했다. 우선 전체 story의 id가 담긴 정보를 받는 것은 단순한 요청이라 어렵지 않았다. $.get('https://hacker-news.firebaseio.com/v0/topstories.json?print=pretty', (storyArr) => { let top30 = storyArr.slice(0, 30); } 상위 30개 article만 먼저 보여주면 되기 때문.. 2019. 11. 20.