https://edu.nextstep.camp/s/M4ILAt8c/lt/FXBmba3y
본격적인 E2E 테스트가 시작되는 듯하다.
앞서 e2e 테스트가 무엇인지에 대해 공부했었다. (1차 회고에서 정리한 테스트의 종류 복습하기)
그외 테스트에 관해 개념을 좀 더 다질 수 있는 질문들이 있었다.
라는 새로운 질문이 등장했다.
라는 개념이 등장했다.
🟩 학습 목표: 클린코드로 나아가기 위한 리팩터링 기준점을 스스로 만들어 나갈 수 있다.
3대 원칙 - 로버트 C. 마틴 (밥 아저씨, 클린 코더)
좋은 테스트의 조건
https://edu.nextstep.camp/s/M4ILAt8c/ls/wWvplDXz
글을 읽고 느낀 점
=> 지금 내가 작성하는 테스트는 BDD에 가깝지 않나.
=> 진짜 그냥 TDD 는 어떤 형태일지 궁금.
여기서부터는 자동차 게임경주를 위한 자스 기본 개념들이다.
🟩❌ 학습 목표:
클로저에 대해 설명할 수 있다.
이라는 새로운 개념이 등장했다.
이 글을 읽고 나서
에 대답할 수 있게 되었다.
console.log(increase()) // 1
console.log(increase()) // 2
console.log(increase()) // 3
=> 왜 즉시 실행함수...? increase 를 함수가 아니라 함수를 할당받는 변수로 만듬. 즉시실행함수 개념에 대한 이해가 부족한 듯하다. 잠깐 복습하고 오자 (👉)
🟩 학습 목표:
자바스크립트 엔진에서 이벤트가 어떤 순서로 동작하는지 알 수 있다.
싱글 스레드란?
: 한 번에 하나의 업무(task)만 처리하는 것
이벤트 루프가 존재하는 이유 = 동시성:
자바스크립트는 싱글 스레드로 작동한다. 이런 자바스크립트가 동시에 여러 태스크를 처리할 수 있도록 동시성을 부여해주는 역할.
비동기 처리:
자바스크립트의 비동기 처리란 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성을 의미합니다. 동시에 여러가지 작업을 처리할 수 있고 기다리는 과정에서 다른 함수를 호출할수도 있습니다.
비동기처리는 동시에 작업을 시작하여 먼저 완료되는 작업부터 노출.
대부분의 자바스크립트 엔진은 크게 2가지 영역으로 구분할 수 있다.
1) Memroy Heap
2) Call Stack
데모 영상을 보면
값을 입력 후 자동차가 뜨기까지 시간이 좀 걸린다. 그 후 설정한 양의 자동차들이 설정한 수 만큼의 경기를 진행하는 결과창을 보여준다. 그 후 "축하합니다" 라는 알럿이 뜬다.
핵심은 이 결과를 보여주는 함수를 '시간이 좀 걸리게' 만드는 것이다.
1) 1경기를 할 때 2경기가 싱크되고 있어야 하고,
2) 2경기를 할 때 3경기가 싱크되고 있어야 한다.
3) 알럿은 모든 경기가 끝난 후 약 2초후에 뜨도록 해야한다.
모두 시간을 다루는 비동기 함수와 관련이 있다.
🟩 학습 목표 :
일정 시간이 지난 후에 원하는 함수를 예약 실행(호출)할 수 있게 하는 것을 '호출 스케줄링(scheduling a call)'이라고 합니다. 호출 스케줄링을 구현하는 방법은 세 가지가 있습니다.
setTimeout을 이용해 일정 시간이 지난 후에 함수를 실행하는 방법
setInterval을 이용해 일정 시간 간격을 두고 함수를 실행하는 방법
requestAnimationFrame을 이용해 브라우저에 최적화된 방법으로 함수를 실행하는 방법
✅ setTimeout
✅ setInterval
❌ Request Animation Frame
JavaScript 동기, 비동기처리와 콜백 함수 | kkhcode
What the heck is the event loop anyway? | Philip Roberts | JSConf EU
이벤트 루프란 (a.k.a. 자바사크립트가 비동기 함수를 실행시키는 방법) 00:00~21:00
V8 엔진은 어떻게 내 코드를 실행하는 걸까? | Evan Moon
What the heck is the event loop anyway? | Philip Roberts | JSConf EU
21분부터 공부하기 (feat. repaint 공부)