지금까지 3주 동안 배웠던 자바스크립트 문법을 정리하는 JavaScript Koans를 페어분과 진행했다. 시간이 흘러서 초반에 배웠던 것들은 기억이 가물가물했는데 이렇게 복습을 할 기회가 생겨서 좋았다. 그리고 문제를 푸는 건 엄청 어렵진 않았지만 왜 답이 이렇게 나왔는지 깊게 고민해야 했다. 몰랐던 새로운 개념들이 나오기도 해서 페어분과 함께 내용을 찾아 보면서 진행을 했는데 그 내용들과 헷갈렸던 문제들을 정리하려고 한다.
📒 01_Introduction
expect 함수
이전의 테스트에서도 expect 함수를 사용한 테스트 코드를 본 적이 있었는데 정확한 사용법은 몰랐었다. 이번에 알게 됐는데 expect 함수는
expect(테스트하는값).기대하는조건 이렇게 사용할 수 있다.
기대하는조건에 해당하는 함수를 matcher라고 하는데 다양한 종류가 있다.
'참인 것이어야 한다' => to.be.true
'3과 같아야 한다' => to.equal(3)이번 테스트에선 이 두가지가 주로 사용되었다.
📒 02_Types-part1
expect(1 + '1').to.equal('11');숫자 1과 문자열 '1'을 더했을 때 숫자+문자열=문자열이므로 '11'이 나온다.
expect(123 - '1').to.equal(122);숫자에서 문자열을 뺐으니 마찬가지로 문자열이 나올 거라고 예상했는데 이번엔 숫자 122가 나왔다.
이런 경우들을 전부 외울 필요는 없다. 버그를 만들지 않기 위해
'최대한 같은 타입끼리 연산을 하자'는 것만 유의하면 된다!
📒 04_Scope
호이스팅(hoisting)
JavaScript에서 호이스팅이란, 인터프리터(프로그래밍 언어의 소스 코드를 바로 실행하는 컴퓨터 프로그램 또는 환경)가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미한다.
한 마디로, 변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 끌어올리는 것이다. 자바스크립트가 함수 실행 전에 해당 함수를 한 바퀴 돌고 함수선언에 대한 정보를 기억하고 있다가 실행시키게 된다.
let funcExpressed = 'to be a function';
expect(typeof funcDeclared).to.equal('function');
expect(typeof funcExpressed).to.equal('string');
function funcDeclared() {
return 'this is a function declaration';
}
funcExpressed = function () {
return 'this is a function expression';
};- var 변수 선언문과 함수 선언문에서 호이스팅 발생 O
- let/const 변수 선언, 함수 표현식에서 호이스팅 발생 X
따라서 위 코드에서 함수 선언문으로 쓴 funcDeclared은 호이스팅이 발생해서 함수 선언이 최상단에서 된 것과 똑같기 때문에 type이 function이다.
그러나 함수 표현식을 쓴 funcExpressed는 호이스팅이 발생하지 않아서 type이 함수가 아닌 처음에 할당한 값인 string이 된다.
TDZ(Temporal Dead Zone)
- 일시적 사각지대라는 의미로, 변수가 선언되고 나서 변수의 초기화가 이루어지기 전까지의 구간을 뜻함
- var, function, import는 TDZ의 영향을 받지 않음
- const, let, class는 영향을 받음
