if (1 < x < 3) { // *어떤* x 값이던 참입니다!} 인 이유

TypeScript 공식 문서를 보던 중 

if (1 < x < 3) { // *어떤* x 값이던 참입니다! }

라는 코드를 보게 되었다. 해당 예시는 JavaScript 의 동일 연산자는 (==) 인수를 강제로 변환하여(coerces), 예기치 않은 동작을 유발한다라는 설명의 예시였다. 

 

나는 왜 1<x<3에 어떤 x가 들어가도 참인지 이해가 가지 않았고, 찾아본 결과를 기록해두려 한다. 

 

자바스크립트에서 비교 연산자 <, <=, >, >=, ==, != 는 피연산자의 타입이 다르다면 인수를 강제로 변환한다. 그래서 boolean과 number를 비교하게 되면 boolean을 숫자로 변환해서 연산하게 된다. false는 0으로 true는 1로. 이것이 ==대신 ===를 써야하는 이유이기도 하다. 

 

실제로 1<x<3 의 동작은 아래와 같이 실행된다. 

(1<x)<3

여기서 (1<x)의 값이 true거나 false여도 각각 1과 0으로 변환되어 최종적으로 비교하게 되는 3보다는 작은 수가 되는 것이다. 따라서 1<x<3는 x의 값에 상관없이 true가 되게 된다.