('b' + 'a' + + 'a' + 'a').toLowerCase();
'banana'자바스크립트 유명한 밈 중에 없던 바나나도 만들어 버리는 밈이 있다.
이를 분석해보자!
1. 연산자 우선순위
1. ()
2. new(매개변수 존재), ., [ ](프로퍼티 접근), ( )(함수 호출), ? .(옵셔널 체이닝 연산자)
3. new(매개변수 미존재)
4. x++, x--
5. !x, +x, -x, ++x, --x, typeof, delete
6. **
7. *, /, %
8. +, -
9. <, <=, >, >=, in, instanceof
10. ==, !=, ===, !==
11. ??
12. &&
13. ||
14. ? ... : ...
15. 할당 연산자(=, +=, -=, ...)
16. ,
2. 연산자 결합 순서
좌항 -> 우항
+, -, /, %, <, <=, >, >=, &&, ||, ., [ ], ( ), ??, ?., in, instanceof
좌항 <- 우항
**, ++, --, 할당 연산자 (=, +=, -=, ...), !x, +x, -x, ++, --x, typeof, delete, ? ... : ...
3. 정리
위 내용을 어떻게 외우겠는가!
특징들을 찾아서 정리해보자.
우선순위
( )가 최 우선순위이다. 이는 명시적으로 우선순위를 정해주기 위함이니, 언젠가 이 블로그의 우선순위를 다시 참고하기 싫다면 명시적으로 우선순위를 잘 정해주자!
기본적으로 단항 연산자, 이항 연산자, 삼항 연산자, 할당 연산자 순으로 우선순위가 결정된다.
결합 순서
단항 연산자는 결합 순서가 의미가 없으므로 **, 할당 연산자, 삼항 연산자를 제외하고는 -> 방향으로 결합이 진행된다.
상세 과정
('b' + 'a' + + 'a' + 'a').toLowerCase();1. 우선순위 1 인 ( ) 부터 연산하자
2. 단항 연산자인 +'a'부터 연산하자.
3. 단항연산자 +x 는 x가 숫자가 아니면 NaN(산술 연산 불가 not-a-number)을 표현한다. 'a'는 문자열이므로 NaN이 표현된다.
('b' + 'a' + NaN + 'a').toLowerCase();
4. 이항 연산자 + 를 -> 방향으로 연산하자.
('ba' + NaN + 'a').toLowerCase();
5. 'ba' + NaN 좌항은 문자열, 우항은 숫자이다. 이때, 문자열이 포함 되었으므로 + 는 문자열 연결 연산자로 동작한다.
('baNaN' + 'a').toLowerCase();
6. + 는 문자열 연결 연산자로 동작한다.
('baNaNa').toLowerCase();
7. ( ) 연산이 끝났으니 문자열에 . 연산자로 연결된 함수를 호출한다.
'baNaNa'.toLowerCase();'banana'결론
위와같은 과정을 거쳐 'banana' 가 출력되었던 것이다!
이렇게 분석이 필요할 정도로 헷갈리게 연산자를 쓰지 않도로 ( ) 연산자와, 암묵적 타입 변환이 잘 일어나지 않게 코드를 작성해 예측 가능하고 가독성 좋은 코드를 작성하자.
