논리 연산자

논리 연산자에는 3가지 종류가 있다.

• or ||
• and &&
• not !

우선 순위는 not -> and -> or 의 순서이다.
논리 연산자 라고 해서 모든 값이 참,거짓만 사용하는 것은 아니다.
boolean형 뿐만 아니라 모든 type의 값을 받을 수 있다.
결과값 또한 boolean형이 아닐 수 있다.

or

'또는'이라는 뜻을 가진 or연산자이다.
말 그대로 A 또는 B 또는 C 라고 했을때 A,B,C 중 적어도 하나만 만족해도 된다는 의미이다.
따라서 모든 condition들 중에서 단 하나만 true여도 true값을 반환한다.

or의 연산

하지만 이를 참,거짓을 뱉어내는 식으로 사용하지 않게 되면 다음과 같이 사용할 수 있다.

const result = value1 || value2 || value3;

이는 가장 왼쪽부터 오른쪽으로 이동하며 truthy한지 falshy한지 판별한다
이때 가장 먼저 발견한 truthy한 값을 반환한다
값을 반환할때는 원래의 값으로 반환한다
예를 들어 value1 이 null로 falsy한 값이고 value2가 'hello'로 truthy한 값이라면
result에는 'hello'가 할당된다
그리고 이후 값들은 계산하지 않는다.
만약 모든 값들이 falsy한 값이라면 가장 오른쪽에 있는 value를 반환한다

and

'그리고'라는 뜻을 가진 and연산자이다.
이는 A 그리고 B 그리고 C이기 때문에 모든 값들이 성립해야함을 알 수 있다.
따라서 모든 condition들이 true일때만 true를 반환한다

and의 연산

or과 마찬가지로 and도 역시 연산이 가능하다

const result = value1 && value2 && value3;

연산 순서는 동일하게 가장 왼쪽부터 오른쪽으로 이동한다
하지만 or과는 다르게 falsy한 value를 찾는다
그리고 가장 먼저 발견한 falsy한 value를 반환한다
위의 예시를 똑같이 적용시켜보면value1 이 null로 falsy한 값이고 value2가 'hello'로 truthy한 값이라면
result에는 제일 처음으로 falsy한 value인 null을 반환한다
역시 마찬가지로 모든 value들이 truthy한 값이라면 가장 오른쪽 value를 반환한다

이를 쉽게 기억하기 위해

F&& T||로 기억하도록 하자(

&&은 falsy한 값을 ||은 truthy한 값을 찾는다

not

다른 논리 연산자보다 익숙할거라 생각한다.
이는 형 변환 파트에서 한 번 만났던 적이 있다.
바로 '!'를 이용해서 boolean형으로 암시적 형변환을 했던 기억이 있을 것이다.
이는 매우매우 간단하다
단순히 !를 하나만 사용하면 truthy한 값을 false로 falsy한 값을 true로 변환해주는 역할이다.
!!처럼 두 번 사용하면 truthy한 값은 true를 falsy한 값은 false를 반환하게 된다

!!!!처럼 여러 번 사용해도 계산은 되지만 추천하진 않는다.

그렇다면 복합적인 연산을 한 번 살펴보자

const result = null || 2&&3 || '0';

위와 같은 식에서 result에는 어떤 value가 할당될까?

정답은 3이다.

왜 그런지 이유를 살펴보면 제일 처음에 얘기했던 연산자의 순서 때문이다.
not -> and -> or이라고 언급했었다
따라서 2&&3연산이 먼저 실행되어 3이 반환된다.
그러면 다음과 같이 변한다.

const result = null || 3 || '0';

이러면 다음은 ||를 생각해보면 된다.
제일 처음으로 나오는 truthy한 value를 반환하므로 3이 반환된다.

다른 예제를 살펴보자

alert(alert(1) || 2 || alert(3));

이를 실행하면 결과가 어떻게 나올까?

정답은 1이 출력되고 2가 출력된다

이유는 함수에 동작에 있다.
우선 alert() 함수는 undefined를 반환한다.
따라서 alert(1)은 falsy한 값이다.
'그렇다면 바로 2가 출력되어야 하지 않나요?' 라고 생각했다
하지만 alert(1) -> 2 -> alert(3) 순서로 확인이 진행되며
alert(1)을 확인할때 함수가 호출된다는 것이다.
따라서 alert(1)이 실행되고 alert(2)가 실행되는 것이다.

그렇다면 또 의문을 가질 수 있다.
'왜 alert(3)은 호출이 안되나요?
그것은 바로 처음으로 truthy한 값을 찾아서 연산이 종료되었기 때문이다.

Switch Case문

우선 사용 예제 코드부터 살펴보자

switch(value) {
  case value1 : ...;
  break;

  case value2 : ...;
  break;

  defualt : ...;
  break;
}

처음 봤을땐 이게 무슨 소리를 하는지 모를 수 있다.
하지만 천천히 보면 condition이 되는 부분은 value가 될 것 같다는 생각이 든다.
그렇다면 case value1은 무엇일까?
바로 value와 값이 같은지 확인하는 장치이다.
따라서 value와 value'n'이 값이 같다면 실행문을 실행시키고 break;를 실행하는 의미이다.

만약 모든 condition 즉 value와 일치하는 value'n'이 없다면 default 부분을 실행시키는 것이다.

그렇다면 여기서 break;는 무슨 역할을 하는 것일까?
break 가 없다면 일어나는 일을 살펴보면 이해가 빠르게 된다.
예를 들어 value'n'에서 0<n<101(n은 정수)까지라고 가정해보자
이때 value와 같은 value'n'은 n이 30(value30)이라고 가정해보자
그리고 모든 부분에서 break; 가 없다고 가정해보자

그렇다면 우선 value30에 해당하는 실행문이 실행되는 것은 이해가 된다.
하지만 break; 가 없기 때문에 그 이후에 나오는 모든 실행문들이 실행된다(value31, value32, value33, ... , value100)

함수 내부에서 사용법 및 주의점

if문도 마찬가지지만 switch case문도 함수에서 사용해서 값을 반환하기 위해선 break; 보다는 return을 채택하는 것이 도움이 된다.

주의할 점으로는 switch case문은 일치연산자가 base이다
따라서 value와 value'n'의 type까지 비교한다.
따라서 value에는 0이 value'n'에는 '0'이 할당되었다면
실행되지 않는다.

if else문과의 차이점

if문은 모든 조건을 방문하며 일치하는 condition이 나올때까지 순회한다.

하지만 switch case문은 일치하는 부분만 골라서 방문한다.

따라서 condition의 양이 증가할수록 switch case문이 유리하다.
하지만 사용자 입장에선 큰 차이가 없다.

ETC

• confirm()
  confirm() 함수는 true와 false를 반환한다
• prompt()
  prompt() 함수가 실행 중 esc키를 누르게 되면 null이 반환된다
• String.includes()
  String.includes('${value}')를 이용하여 value에 해당하는 값을 포함하는지 확인할 수 있다.
  이는 true 혹은 false를 반환한다.
• ?.
  optional chaning이라 부른다.
  이는 null이나 undefined를 계산 도중 undefined로 변환해주는 역할이다.
  ex) admin?.toLowerCase()
• 함수를 종료할때는 return문을 사용하여 종료할 수 있다.
• 정규 표현식
  주로 validation test(유효성 검사)를 할 때 많이 이용한다
  이는 조건에 맞는 문자열을 찾아주는 역할을 한다.
• replace(), replaceAll()
  replae('value1' , 'value2'); 을 이용해 value1과 일치하는 값을 하나 찾아 value2로 변경가능하다.
  replaceAll('value1' , 'value2');를 이용해 value1과 일치하는 모든 값을 찾아 value2로 변경한다.
  정규표현식을 이용하면 replace를 replaceAll처럼 사용할 수 있다.

str.replace(\/s*/g , '');
str.replaceAll(' ', '');

위 두 식은 같은 식이 된다.

• 함수 유지보수 지속성
  함수는 되도록 하나의 작업만을 담당하는게 좋다.
  예를 들어 '일어나서 밥먹어라'라는 문장을 생각해봤을때
  하나의 연결된 동작으로 생각하기 쉽다.
  하지만 이를 함수로 나누면

1. 일어나는 함수
2. 밥먹는 함수
   
   로 나눌 수 있다는 소리이다.
   이는 유지보수 측면에서 유리하다.
   
   이를 SOC(Separation Of Concerns - 관심사의 분리)라고 부른다