[javaScript] 연산자 우선순위: 조건문에서 num1<num2<num3이 안되는 이유

 

1.문제 발생

오늘 엄청나게 헤매던 문제가 있었다. 점수에 해당하는 등급을 리턴하는간단한 문제 였는데, 정답은 ⬇️아래와 같았다.

function convertScoreToGrade(score) {
  if (score>100||score<0) {
    return 'INVALID SCORE' ;
  } else if (score>=90) {
    return 'A';
  } else if (score>=80) {
    return 'B' ;
  } else if (score>=70) {
    return 'C' ;
  } else if (score>=60) {
    return 'D';
  } else {
    return 'F'
  }
}

그런데 나는 도무지 ⬇️아래의 코드가 왜 정답이 안되는지 알 수가 없었다.

function convertScoreToGrade(score) {
  if (score>100||score<0) {
    return 'INVALID SCORE' ;
  } else if (100>=score>=90) {
    return 'A';
  } else if (89>=score>=80) {
    return 'B' ;
  } else if (79>=score>=70) {
    return 'C' ;
  } else if (69>=score>=60) {
    return 'D';
  } else {
    return 'F'
  }
}

물론, 당연히 정답 코드가 깔끔하게 논리적인 것은 알겠는데, 지저분 하더라도 답은 나와야 되는 것 아닌가 싶었다. 

그런데 해당 식에선 올바른 등급은 안나오고 'INVALID SCORE' 혹은, 'F'의 값만 출력되었다.

---

2.테스트 수행

문제의 원인을 파악하기 위해 콘솔창에 비교연산자를 두개써서 값의 범위를 정하는 시도를 해보았다. 

let num = 15;

//1️⃣
10<num<20
//true 출력

//2️⃣
20>num>10
//false 출력

띠용?? 같은 의미인데 하나는 false?? 문제는 이것인것 같았다.

한참을 씨름한 끝에 알아냈는데, 자바스크립트의 "연산자 우선순위" 때문이었다. 🤮(힌트에 나와있었음에도 개념을 잘 이해하지 못해 계속 뺑뺑 돌았던 것이었다....)

---

3.테스트 결과 파악

 

연산자에는 우선순위가 있는데, 여기서 알아야할 우선순위에 영향을 받는 특징은 이렇다

• 비교연산자는 논리연산자보다 우선시 된다.
• 동급의 연산자일경우 앞에서 부터 순차적으로 계산이된다.

그리고 간과해서는 안될, 값의 boolean 특징이 있다.

• truthy한 값은 1로, falsy한값은 0으로 자동 연산된다.

그래서 두 테스트 값의 결과는 다음과 같은 경로로 다르게 된 것이었다.

1️⃣에서
10<15<20는
①먼저 10<15를 비교해서 true가 도출되고,
②이 truthy한 값이 1이 되어 1<20이 되어 true가 도출된다.

2️⃣에서
20>15>10는
①먼저 20>15를 비교해서 true가 도출되고
②이 falsy한 값이 0이 되어 0>10이 되어 false가 도출된다.

---

4.테스트 결과 문제에 적용

 

그래서!! 결국 오답이 왜 오답이었는지를 설명하자면

convertScoreToGrade(95);

function convertScoreToGrade(score) { //예시로 95를 넣어보자
  if (score>100||score<0) { 
    return 'INVALID SCORE' ;
  } else if (100>=score>=90) { //100 >= 95 ➡️ true ➡️ 1(truthy) >= 90 ➡️ false
    return 'A'; // 들어오지 않는다.
  } else if (89>=score>=80) { //89 >= 95 ➡️ false ➡️ 0(falsy) >= 80 ➡️ false
    return 'B' ; // 들어오지 않는다.
  } else if (79>=score>=70) { //79 >= 95 ➡️ false ➡️ 0(falsy) >= 70 ➡️ false
    return 'C' ; // 들어오지 않는다.
  } else if (69>=score>=60) { //69 >= 95 ➡️ false ➡️ 0(falsy) >= 60 ➡️ false
    return 'D'; // 들어오지 않는다.
  } else { //모든 조건이 아니므로 여기에 들어온다
    return 'F'
  }
}

---

5.결론

• a<b<c ❌ b>a && b<c⭕
• if문에서는 위>아래 순서로 return됨을 이용한다.

---

후... 이거 때문에 얼마나 고민을 하고 구글링을 했는지...절레절레

다시는 안 까먹을거 같다. 명심!! 비교연산자도 +-*/ 처럼 우선순위가 있다!!