[TIL-96] 위코드 사전스터디 4주차

Promise

• 비동기
  • https://www.daleseo.com/js-async-callback/
• https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise
  • Promise는 프로미스가 생성된 시점에는 알려지지 않았을 수도 있는 값을 위한 대리자로, 비동기 연산이 종료된 이후에 결과 값과 실패 사유를 처리하기 위한 처리기를 연결할 수 있습니다. 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있습니다. 다만 최종 결과를 반환하는 것이 아니고, 미래의 어떤 시점에 결과를 제공하겠다는 '약속'(프로미스)을 반환합니다.
  • 느긋한 평가와 연산 연기를 위한 방법을 프로미스라고 부르는 언어도 여럿 존재합니다(Scheme 등). JavaScript에서의 프로미스는 콜백 함수를 연결할 수 있는, 이미 진행 중인 프로세스를 나타냅니다.

• 유튜브 클론코딩
  • 콜백함수 : 다른 함수의 인자가 됨...
  • promise : 콜백 대신 쓸 수 있는 방식.
  • async ~ await : 코드를 순서대로 읽다가 async 안에 쓰인 await 문이 나오면 그 코드가 동작하는 걸 기다려줌.
    • JS에서 콜백은 다른 함수가 실행을 완료한 뒤 실행되는 함수.
    • await를 사용하려면 반드시 async 함수를 먼저 만들어야 함.

[TIL-70] 6.13 참고

• mongoose 모델의 함수 사용
  • 예) Video.find()
  • 이때 콜백 함수 활용하거나 promise 활용.
    • callback : 무언가 발생하고 난 뒤 호출되는 함수. 자바스크립트에서 기다림을 표현하는 방법.
      • 실행과 동시에 적용되지 않음. app.listen(PORT, handleListening) 같은 경우.
      • Video에서도 자바스크립트 밖의 데이터베이스를 가져와야하기 때문에 기다림 필요. 그럴 때 콜백이나 promise 사용.
      • 문법 : configuration과 호출할 함수 필요.
        • 예) 모든 비디오를 찾는다 : Video.find( {}, (error, videos) => { 콘솔로그 } )
          • {} 중괄호 : search terms. 비어있으면 모든 형식을 찾는다는 뜻.
          • (콜백) : err, docs라는 signature 가짐. err와 docs 수신하는 함수 생김.
          • 다음과 같음.
            • const handleSearch = (error, videos) => {
                  console.log("errors", error);
                  console.log("videos", videos);}
              Video.find( {}, handleSearch)
          • render home하려면 videos 배열이 필요하므로 일단 빈 videos: [] 보냄.
        • 이때 video.find() 다음에 console.log("아무말") 하면 "아무말"이 먼저 찍히고, 로거 찍히고, 에러랑 비디오 찍힘.
          • logger는 리퀘스트 완성되면 출력. 페이지를 요청하고, 콘솔로그 띄우고, render 거쳐서 logger 얻음.
          • 맨 마지막에 error, videos 나왔다는 건 시간이 걸린다는 뜻. 콜백 때문에 특정 코드가 마지막에 실행된 것.

 

• try ~ catch
  • try/catch에서 "try" 블락에 에러가 나면 "catch" 코드가 실행됨.

 

 

함수 선언식 & 함수 표현식

[출처] https://joshua1988.github.io/web-development/javascript/function-expressions-vs-declarations/ 

• 함수 선언식 : function 함수명() { 코드 }
• 함수 표현식 : const 함수명 = function() { 코드 }

•  차이
  • 함수 선언식은 호이스팅되어서 자바스크립트 코드를 읽을 때 가장 상위로 올라간다. 함수 표현식은 호이스팅되지 않아서 함수 정의 부분 앞에서 함수를 실행하면 에러가 난다.
    • [참고] https://hanamon.kr/javascript-%ED%98%B8%EC%9D%B4%EC%8A%A4%ED%8C%85%EC%9D%B4%EB%9E%80-hoisting/
      • 호이스팅 : 변수/함수 선언부가 코드 실행시 상단으로 끌어올려진 것처럼 읽히는 것. 선언이 코드 실행 보다 먼저 메모리에 저장되는 과정으로 인한 현상.
  • 함수 표현식은 임시 변수에 넣지 않고, 다른 함수의 인자로 넘어가는 콜백함수로 사용될 수 있음.