자바스크립트 삼항연산자를 이용해서 if 에서 처럼 여러라인의 코드를 실행하게 하기

나는 자바스크립트 학습자에게 amount가 20보다 크면 console.log('크다') 를, 아니면 console.log('작다') 를 찍도록 주문했다.

아래와 같은 코드를 쓸것을 기대했다.

aWYoYW1vdW50ID4gMjApIHsKICAgIGNvbnNvbGUubG9nKCftgazri6QnKTsKfSBlbHNlIHsKICAgIGNvbnNvbGUubG9nKCfsnpHri6QnKTsKfQo=


     if(amount > 20) {
     console.log('크다');
     } else {
     console.log('작다');
     }

그런데 기대와 다르게

YW1vdW50ID4gMjAgPyBjb25zb2xlLmxvZygn7YGs64ukJykgOiBjb25zb2xlLmxvZygn7J6R64ukJyk=


     amount > 20 ? console.log('크다') : console.log('작다')

이렇게 표현했다.

이것 역시 문제 없이 잘 작동하는 코드이다

그래서 amount가 20보다 크면

Y29uc29sZS5sb2coJ+2BrOuLpCcpO2NvbnNvbGUubG9nKCftgazqtazrgpgnKTs=


     console.log('크다');console.log('크구나');

아니면

Y29uc29sZS5sb2coJ+yekeuLpCcpO2NvbnNvbGUubG9nKCfsnpHqtazrgpgnKTs=


     console.log('작다');console.log('작구나');

를 찍도록 주문했다

그랬더니 아래와 같이 표현했다

YW1vdW50ID4gMjAgPyBjb25zb2xlLmxvZygn7YGs64ukJyk7Y29uc29sZS5sb2coJ+2BrOq1rOuCmCcpOyA6IGNvbnNvbGUubG9nKCfsnpHri6QnKTtjb25zb2xlLmxvZygn7J6R6rWs64KYJyk7


     amount > 20 ? console.log('크다');console.log('크구나'); : console.log('작다');console.log('작구나');

그런데 이것은 문법적으로 맞지 않다

좀 여러줄로 나눠보면 아래와 같다

YW1vdW50ID4gMjAgPyAKICAgIGNvbnNvbGUubG9nKCftgazri6QnKTsKICAgIGNvbnNvbGUubG9nKCftgazqtazrgpgnKTsgCjogCiAgICBjb25zb2xlLmxvZygn7J6R64ukJyk7CiAgICBjb25zb2xlLmxvZygn7J6R6rWs64KYJyk7


     amount > 20 ?
     console.log('크다');
     console.log('크구나');
     :
     console.log('작다');
     console.log('작구나');

이런 모습의 코드가 된다

삼항연산자는 그 라인 하나 자체가 한줄의 코드여야하는데 중간에 세미콜론이 들어가서 문법적 에러가 생긴것이다

이렇게 console.log 를 두개 찍어보라고 한 이유는 위와 같이 쓸 경우 문제가 생긴다는걸 보여주기 위함이였다

만약 if 로 했다면 아래와 같이 쓰면 그만인 코드 였다.

aWYoYW1vdW50ID4gMjApIHsKICAgIGNvbnNvbGUubG9nKCftgazri6QnKTsKICAgIGNvbnNvbGUubG9nKCftgazqtazrgpgnKTsKfSBlbHNlIHsKICAgIGNvbnNvbGUubG9nKCfsnpHri6QnKTsKICAgIGNvbnNvbGUubG9nKCfsnpHqtazrgpgnKTsKfQ==


     if(amount > 20) {
     console.log('크다');
     console.log('크구나');
     } else {
     console.log('작다');
     console.log('작구나');
     }

그래서 삼항연산자의 모습은 그대로 유지하고 console.log 는 여러줄 찍으면서 문법적으로도 문제 없는 모습을 만들어볼 것을 주문했다

그래서 위의 문법적 문제를 없앨수 있는 방법은 다음의 방법들이 있다

YW1vdW50ID4gMjAgPyAKICAgIChjb25zb2xlLmxvZygn7YGs64ukJyksY29uc29sZS5sb2coJ+2BrOq1rOuCmCcpKQo6IAogICAgKGNvbnNvbGUubG9nKCfsnpHri6QnKSxjb25zb2xlLmxvZygn7J6R6rWs64KYJykp


     amount > 20 ?
     (console.log('크다'),console.log('크구나'))
     :
     (console.log('작다'),console.log('작구나'))

혹은

YW1vdW50ID4gMjAgPyAKICAgIGZ1bmN0aW9uKCl7CiAgICAgICAgY29uc29sZS5sb2coJ+2BrOuLpCcpOwogICAgICAgIGNvbnNvbGUubG9nKCftgazqtazrgpgnKTsgCiAgICB9KCkKOiAKICAgIGZ1bmN0aW9uKCl7CiAgICAgICAgY29uc29sZS5sb2coJ+yekeuLpCcpOwogICAgICAgIGNvbnNvbGUubG9nKCfsnpHqtazrgpgnKTsgCiAgICB9KCkK


     amount > 20 ?
     function(){
     console.log('크다');
     console.log('크구나');
     }()
     :
     function(){
     console.log('작다');
     console.log('작구나');
     }()

하면 된다