Section 1에서 가장 어렵다고 느껴졌던 React 부분을 다시 배웠습니다. 부모 컴포넌트와 자식 컴포넌트가 왔다 갔다 많이 해서 좀 정신없었긴 했지만 좀만 배웠던 내용 더 정리하면 이해 잘할 수 있을 것 같아요!😊 내일까지 React를 이용한 항공권 예약 사이트를 구현하는데요. 아직 REST API로 어떻게 구현하는지에 대해 못풀었지만 내일까지 풀 수 있도록 마저 열심히 해보도록 하겠습니당 Lifting State Up React에서 컴포넌트의 데이터 흐름은 하향식인데요. 따라서 부모 컴포넌트가 자식 컴포넌트에게 데이터를 전달합니다. 하지만 부모 컴포넌트에서의 상태가 하위 컴포넌트에 의해 변화하는 경우도 있는데요. 이 경우 React의 가장 큰 특징인 하향식에 위배되는 문제가 발생합니다. 이를 해결..

Node.js 모듈에서 데이터를 받아오는 것에 이어 오늘은 URL에서 데이터를 받아와 비동기적으로 함수를 실행하는 방법을 공부했습니다. 어제보다는 더 익숙해져서 좀 더 수월하게 문제를 풀 수 있었습니다. 어제의 '나'보다 더 나은 오늘의 '나'가 되기 성.공.😊 fetch API 비동기 요청의 대표적인 사례로 URL로 요청하는 걸 가능하게 해주는 API로 JSON 형태로 변환 후 Promise로 전달합니다. Promise 형식으로 되어있기 때문에 .then 을 사용할 수 있습니다. 포털 사이트에서 최신뉴스, 날씨, 주가 등 동적으로 데이터를 받아와야 하는 정보를 보여줄 때 주로 사용됩니다. Sprint Review Async/ Await 를 여러 번 실행할 때 일일이 변수 선언 할당하지말고 배열 이용해서..

오늘은 본격적으로 비동기에 대해서 공부했습니다. 이 부분은 완전히 처음 배운 부분이라 아직 많이 낯설지만 자주 보면서 익숙해지도록 노력하겠습니다! 비동기 정의 및 사례 동기와 달리 요청에 대한 결과가 다른 요청과 동시에 일어나지 않는 것을 말합니다. 따라서 요청 이후 다른 부분들이 계속해서 작업할 수 있게 해줍니다. 사례: DOM Elemenet의 이벤트 핸들러, 타이머, 서버에 자원 요청 및 응답 Callback Async(비동기)에서 실행되는 순서를 통제하고 싶을 때 Callback 함수를 사용할 수 있습니다. Error Handling에서 사용할 수 있으며, 주로 (err, data) 순서로 받게됩니다. 하지만 Callback 함수를 많이 사용하게 되면 가독성이 떨어지는 Callback Hell이 ..

오늘은 고차함수 기능을 직접 구현해보는 스프린트를 진행했습니다. Nightmare 문제를 아직 못풀어서 블로깅 이후에 마저 더 풀어보려구요! 본격적인 비동기와 관련한 내용은 내일 나와서 내일 마저 정리해보도록 하겠습니다! 간단하게 고차함수를 리뷰하겠습니다. 1. 고차함수는 콜백함수(Callback Function)를 전달받을 수 있습니다. 콜백함수란 고차함수의 인자로 전달되는 함수라고 합니다. 2. 고차함수는 다른 함수를 리턴할 수 있습니다. 콜백 함수를 전달받은 caller함수는, 함수 내부에서 이 콜백 함수를 호출(invoke) 할 수 있습니다. caller는 조건에 따라 콜백 함수의 실행 여부를 결정할 수 있습니다. 아예 호출하지 않을 수도 있고, 여러 번 실행할 수도 있습니다. 앞으로는 특정 작업..

오늘은 어제 배운 재귀함수를 Sprint에 활용해보았습니다. 확실히 코플릿 문제 푸는 것보다 재귀함수의 활용성을 잘 알아갈 수 있었습니다. 어제 코플릿 풀면서 어떻게 쓰는건지 잘 알게되었지만 "왜" 이미 있는 메서드를 내가 직접 재귀함수를 써서 다시 코드를 짜야하는가에 대해 의문을 계속 가졌었어요. 하지만 오늘 Tree UI를 풀면서 아 이런 곳에 활용할 수 있겠구나! 라는 생각을 했습니당 :) JSON (JavaScript Object Notation) JSON은 JavaScript Object Notation의 줄임말로, 서로 다른 프로그램 사에서 데이터 교환을 위해 만들어진 객체 형태의 포맷입니다. 그리고 JSON 포맷은 JS를 포함한 많은 언어에서 사용하기 때문에 범용성이 높습니다. JSON으로 ..

객체 지향 언어(Object Oriented Programming)란? 객체 지향 언어와 대비 되는 것이 절차적 언어입니다. 절차적 언어는 순차적으로 명령을 조합한 언어로 초기에 이런 형식의 프로그래밍 언어가 사용됐습니다. 이와 달리 객체지향 언어는 순차적으로 명령을 조합하지 않고 여러 클래스와 인스턴스를 사용해서 명령을 만듭니다. 클래스는 데이터 모델의 청사진입니다. 인스턴스는 클래스를 활용한 사례라고 생각하면 됩니다. 클래스와 인스턴스에 대해 자세히 알아보기 전에 먼저 객체에 대해 복습해보겠습니다. 객체의 메소드를 호출하기 위해서는 객체.메소드()를 사용하면 됩니다. 아래와 같이 코드를 사용할 수 있습니다. let counter = { value: 0, increase: function() { thi..