6주 1, 2일차 - 비동기, fetch api

1. 리뷰

1.1 좋았던 점

• 많이 헤멨는데 좋은 페어분과 만나서 과제를 잘 풀어낼 수 있었다.
• 정규시간 이후 스스로 리팩토링 해봤다.

1.2 아쉬웠던 점

• 생활코딩 강의에 내가 헷갈리던게 다 나와있었다. 처음부터 이걸 봤다면 이렇게 헤메지는 않았을텐데.

1.3 notes

독학범위를 벗어나 새로 배운 걸로 과제를 치뤘을 때의 적나라한 현재 실력이 드러났다. 의지가 아니라 시스템이다. 시간적 여유가 있을 때 미리 미리 학습방식을 개선해야겠다. 네트워크와 서버 관련 과제에서 미리 대비가 되어있지 않다면 이번 과제들과 같이 헤멜 것이 뻔하다.

2. 배운 것

• fs모듈의 여러 메서드
• path모듈의 경로 처리 방법
• promise.all
• 화살표함수 표현식 async함수 만드려면
• 변수에 담을때 await 키워드 위치
• promise로 fetch api 사용하기

3. 내용 정리

• catch로 에러 잡으면 프로미스가 fullflilled 됨.
• reject를 catch로 안잡으면 rejected 됨.
• then 안에서 리턴값을 안 주어서 undefined를 리턴하더라도 프로미스객체를 리턴하기 때문에 프로미스 체이닝 자체는 가능하나 유효한 값으로 사용할 수는 없다. undefined를 이어받고 있어서. [[PromiseResult]] : undefined
• promise를 사용하는 이유: 비동기 작업을 처리할 때 성공, 실패의 경우를 표준화된 방법으로(then, catch 메서드) 처리 해줄수 있다.
• async함수를 계속 새로 만들어서 await 시키기에 가독성이 나빠지면 그냥 then을 붙여도 됨.
• nodejs는 비동기적으로 전체 파일을 읽는다.
• 이벤트 루프 자바스크립트는 인터프리터 언어로 싱글 스레드 방식으로 동작하기 때문에 동기적으로만 작업을 수행할 수 있으나 브라우저 내장 기능인 이벤트 루프를 통해 비동기적으로 작업을 수행할 수 있다. 콜백 큐: 비동기 작업이 콜백 큐에서 대기하다 동기 작업이 끝나고 실행된다.
• fs.readFile메서드의 인수로 들어가는 콜백함수는 err, data 두개의 매개변수를 가짐.
• fs.readFile 메서드의 인코딩 방식을 지정하는 두번째 인수인 options는 생략 가능. 하지만 인코딩 방식을 ’utf-8’ 로 지정해주지 않을 경우 <Buffer 23 23 20 …> 이런 이상한 값으로 읽어와짐. (raw buffer data)
• npx jest —runInBand <파일경로> : 개별파일 테스트시 명령어
• 데이터를 주고 받을 때 json 형태로 하는 이유?
• 프로미스를 then으로 체이닝 할 때 매개변수의 값이 계속 다음 체이닝으로 전달될 수 있는 건 리턴값에서 then을 붙이고 있어서 가장 위의 then에서 리턴을 타고 뎁스가 안으로 들어가기 때문에.
• JSON.parse() 는 받아온 json 데이터 파일은 문자열이므로 자바스크립트의 데이터 타입으로 변환시켜 준다. 따라서 데이터를 받아올 때 사용하는 메서드이다.
• JSON.stringify() 는 데이터를 json 파일로(문자열로) 변환시켜 준다. 따라서 데이터를 보내줄 때 사용하는 메서드이다.
• Promise.all() 은 배열로 받아서 배열인 프로미스 반환.
• fetch api 프로미스로 받아서 쓰는 것 중요함.
• nodejs 파트 수업에서 Response 객체 나오므로 이해 해야함. readablestream이 무엇인지 알아야 함.

4. 할 일

• 프로미스는 제대로 이해해야 함.
• response객체가 정확히 무엇인지(fetch api)
• nodejs 공식문서에서 readFile메서드의 콜백함수 설명 다시 읽기
• json 명확한 정의 알기
• 서버, 네트워크쪽 미리미리 준비 해둬야 함.