YOU DON'T KNOW JS - 타입과 문법

p.162

1[] + {}

1. [] → “”로 강제 변환
2. {} → 빈 값 객체
3. []가 “”로 변환되었기 때문에, {}도 문자열로 강제변환됨. “[object Object]”
4. 결과는 “[object Object]”

1{} + []

1. {} → 코드 블럭. 중괄호가 닫히는 순간 이 코드 블럭은 끝난다
2. [] → “”
3. + [] 만 남기 때문에, +”” === 0
4. 결과는 0

중괄호는 사용하는 문맥에 따라 용도가 달라진다

• 객체 리터럴 const a = { };
• 코드 블럭 { }
• 분해 할당 const { a, b } = { a : 123, b: 456 };

p.164 else if는 존재하지 않는다.

1if (a) {
2	...
3} else if (b) {
4	...
5} else {
6	...
7}

얘는 이렇게 파싱된다

1if (a) {
2	...
3}
4else {
5	if (b) {
6		...
7	}
8	else {
9		...
10	}
11}

p.174 세미콜론 자동 삽입 (ASI)

• ASI로 삽입되는 세미콜론은 줄의 끝에만 삽입된다. 줄의 중간에 삽입되지는 않는다
• ;이 누락되면 자바스크립트 코드가 동작하지 않기 때문에, 자동으로 세미콜론을 삽입해준다.

1function foo(a) {
2	if (a) return
3	var b = 3
4}

위 코드는 a의 값이 truthy하다면, b = 3을 수행하지 않고 함수 실행을 종료하려는 의도였을 것이다. ASI는 이 코드가 의도대로 동작하도록 return문 뒤에 세미콜론을 삽입한다.

1function foo(a) {
2	if (a) return**;**
3	var b = 3
4}

그런데 이런 코드라면?

1function foo(a) {
2	if (a) return
3        a * 375
4}

개발자는 a 값이 존재한다면 a에 375를 곱해서 반환하고 싶었다. 그러나 return 문 뒤에 오는 a * 375를 괄호로 감싸지 않은 채로 코드 작성을 끝마쳤다. 그렇다면 자바스크립트 프로그램은 아래와 같이 세미콜론을 삽입할 것이다.

1function foo(a) {
2	if (a) return;
3    a * 375
4}

세미콜론 삽입으로 개발자의 의도와는 완전히 다른 코드가 되었다. 이는 코드 상에 반영되지 않기 때문에, 코드가 의도대로 동작하지 않는 이유를 찾는 데 꽤 오래 걸릴 것이다.

이런 문제를 방지하기 위해, ASI에 너무 의존하지 않고 직접 세미콜론을 넣을 것을 권장하기도 한다.

ASI는 자바스크립트가 엄격하지 않고 유연한 언어가 되는 데 도움을 주고 있다. 세미콜론을 굳이 넣지 않아도 문맥적으로 세미콜론이 필요하다고 간주되면 세미콜론이 알아서 삽입되기 때문에 정말 편리한 기능이다. 그러나 가끔씩 의도하지 않은 세미콜론이 삽입될 수 있는 가능성은 언제나 존재한다. 세미콜론 몇 개를 넣지 않기 위해 이런 위험성을 끌어안는 것은 큰 손해로 돌아올 수 있으니, 가능하면 세미콜론을 수동으로 넣어주는 게 좋겠다.

p.182 try … finally

• try 문을 사용한 다음에는, catch와 finally 둘 중 하나만 써도 된다.
• try 문에서 return문을 사용했다면, try 문의 호출이 끝난 다음, finally 문을 호출하고, 그 다음 값을 반환한다.
• 만약 finally 문에서도 값을 반환했다면, try나 catch 문에서 반환한 값을 덮어씌운다.
• finally 문에서 예외가 발생했다면, 그 이전에 반환된 값은 모두 무시된다.