TIL 3일차

✏️오늘 배운 것

• Task Queue, Microtask Queue, Animation Frames
  Task Queue

  • Web API가 수행한 비동기 함수(setTimeout, setInterval 등)를 넘겨받아 Event Loop가 해당 함수를 Call Stack에 넘겨줄 때까지 비동기 함수들을 쌓아놓는 곳

  Microtask Queue

  • Promise나 async/await, process.nextTick, Object.observe, MutationObserver과 같은 비동기 호출을 넘겨받는다.
  • 일반 task queue보다 우선순위가 더 높다.

  Animation Frames

  • requestAnimationFrame과 같이 브라우저 렌더링과 관련된 task를 넘겨받는 Queue이다.
  • 우선순위는 Microtask보다는 낮고, 일반 Task보다는 높다.
  • Queue 작동 과정 보기 https://velog.io/@titu/JavaScript-Task-Queue말고-다른-큐가-더-있다고-MicroTask-Queue-Animation-Frames-Render-Queue
    

• 모듈

  모듈이란 애플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드 조각을 말한다.

  • 모듈은 로컬 파일에서 동작하지 않고 http or https 프로토콜을 통해서만 동작한다.

    ES6 모듈(ESM)

  1. script 태그에 type=”module” 어트리뷰트를 추가하면 자바스크립트 파일은 모듈로서 작동한다.

  2. ESM의 파일 확장자는 mjs를 사용할 것을 권장

  3. 항상 ‘use strict’로 실행된다.

  4. 독자적인 모듈 스코프를 갖는다.

  5. 동일한 모듈이 여러 곳에서 사용되더라도 단 한 번만 평가되고 실행한다.

  6. 지연 실행 (HTML 처리가 완료된 후 스크립트가 실행된다.)

     *모듈 내부에서 선언한 식별자를 export 할 수 있다.

     //lib.mjs
     const programmers = "awesome";
     
     function study () {
     	return "hard";
     }
     
     class Person {
     	constructor(name) {
     		this.name = name;
     	}
     }
     
     // 변수, 함수, 클래스를 하나의 객체로 구성하여 공개
     export { programmers, study, Person};

     *다른 모듈에서 공개한 식별자를 자신의 모듈 스코프 내부로 로드하려면 import 키워드를 사용

     // app.mjs
     import { programmers, study, Person} from "./lib.mjs';
     
     console.log(programmers); // awesome
     console.log(study); // hard
     
     // lib.mjs 모듈이 export한 모든 식별자를 lib 객체의 프로퍼티를 모아 import
     import * as lib from './lib.mjs';
     
     console.log(lib.programmers); // awesome

     *모듈에서 하나의 값만 export한다면 default 키워드 사용 (var, let, const 키워드는 사용할 수 없다.)

     ⇒ default 키워드와 함께 export한 모듈은 {}없이 임의의 이름으로 import한다.

• 정규 표현식

  

  정규 표현식 리터럴은 패턴과 플래그로 구성된다. 원하는 값을 얻으려면 패턴을 찾는 것이 중요하다.
  정규표현식을 외울 필요는 없다. 필요할 때 사이트에 들어가서 보고 찾으면 된다.

  • 추천 유튜브 정규표현식 , 더이상 미루지 말자 🤩
    
  • RegexOne(퀴즈) → https://regexone.com/

👦소감

10시부터 진행된 진유림님의 GIT & GITHUB 특강은 나에게 GIT 관련 꿀팁들과 모호했던 사용법들을 확실하게 배울 시간이었다. 추가 Q&A 질문과 답변은 개인적으로 참 도움이 많이 되었다. 나중에 남들도 고민했을 법한 질문들을 멘토님께서 답변해주신 것들을 정리하는 글을 만들어야겠다.

오늘 DAY-2 수업에서 CS 관련 강의를 많이 듣게되면서 강의를 들었던 시간보다 찾아보고 메모하는 데 시간이 더 소요된 것 같다. 각 강의 시간은 10분 채 안되지만, 개인적인 궁금증과 추가로 내주시는 과제들로 30~40분동안 웹사이트를 검색하고 찾았다. 오늘 배운 것이 참 많아 요약하기도 힘들었고 오늘 TIL에 다 적지도 못했다. 정리하다 긴 글들은 따로 velog에 정리해서 올려봐야겠다.

달리님과 첫 커피챗 시간을 가졌다. 데브코스하면서 준비해야 할 점과 챙겨야 할 것들에 대해 잘 알려주셨다. 데브코스 시작한 지 2일 밖에 지나지 않았고 팀끼리 아직 서먹하지만 잡담도 하고 소통도 많이 하면서 서로 도움을 줄 수 있는 관계가 되고 싶다.

👊세 줄 요약

• 3시간이 넘는 강의와 Q&A해주신 유림님 감사합니다!
• 첫 커피챗☕️ 😃👍
• 팀원들과 소통 많이 하고 시간, 컨디션 관리 지금처럼만 하자.