논리연산자를 이용한 값 할당

truthly값  혹은 falsy값을 실제 boolean 값으로  전환

 

truthly와 fasly를 모르신다면, 해당 게시글을 확인하시고 오시면 이해하시는데 도움이 될 것입니다.

 

Falsy and Truthy values

 

truthly값 혹은 falsy값 앞에 '!!'를 붙여주면 실제 boolean 값으로 변환할 수 있습니다. 

 

truthly값 앞에 '!'을 붙여주면 false로 변환되는데, '!'를 하나 더 붙여주면 false를 true 값을 얻을 수 있습니다.

 

 

const userInput = '';
const isValidInput = !!userInput;

console.log(isValidInput);     //false 반환

빈 문자열을 담은 상수 userInput 앞에 !!를 붙여 fasly값을 실제 boolean 값인 false로 변환 후, 상수 isValidInput에  할당하였습니다.

 

 

이렇게 truthly값 혹은 falsy값을 실제 boolean 값으로 변환하여 값을 할당할 수 있습니다.

 

숫자를 사용할 경우 truthly값인 숫자를 true값으로 변환하여 실제 boolean 값으로 사용할 수도 있습니다.

 

해당 부분은 빈 문자열을 false로 변환, 0을 제외한 모든 숫자를 true로 변환하는 방법으로 알아두시면 좋을 것 같습니다.

 

 

 

---

 

OR연산자를 이용한 값 할당

OR연산자를 이용하여 기본값을 상수나 변수에 할당할 수 있습니다.

 

해당 부분을 이해하기 위해서는 OR연산자의 작동방식에 대한 이해가 필요합니다.

 

 

표현식과 연산자 - JavaScript | MDN

 

값 1 || 값 2

OR연산자는 하나의 값만 true이면, true를 반환합니다.

 

때문에 값 1이 true나 truthly값이라면 값 2를 확인하지 않으며,  값 1이 false나 falsy값이라면  값 2를 확인합니다.

 

 

 

const userInput = '';  // 사용자입력

const userName = userInput || 'LSH';

console.log(userName); // 'LSH'출력

상수 userInput이 빈 문자열 즉, falsy값입니다.

 

때문에 JavaScript는 두 번째 값인 'LSH'를 확인하게 되며, truthly값이기 때문에 'LSH'가 반환되고 

 

상수 userName는 'LSH'를 할당받게 됩니다.

 

만약 userInput의 값이 빈 문자열이 아니라 'SH'였다면, truthly 값이기 때문에 'LSH'까지 확인하지 않고 'SH'를 반환하고

userName는 'SH'를 할당받게 됩니다. 

 

이러한 작동방식 때문에 OR연산자를 이용하여 변수나 상수에 기본값 혹은 대체값을 할당할 수 있습니다.

 

 

정리

OR연산자는 첫 번째 값이 true이면, 첫 번째 값을 반환하고 

 

첫 번째 값이 false이고 두 번째 값이 true이면, 두 번째 값을 반환합니다.

 

첫 번째 값과 두 번째 값 모두 false라면 두번 째 값을 반환합니다.

 

 

---

 

AND연산자를 이용한 값 할당

 

값 1 && 값 2

AND연산자의 경우 값 1과 값 2 모두  true가 되어야 true를 반환합니다.

 

때문에 값 1이 true 혹은 truthly값인 것을 확인했어도 값 2까지 확인을 하게 됩니다.

 

 

 

const userInput = 'LSH';

const userName = userInput && 'SH';

console.log(userName); // 'SH' 출력

상수 userInput 은 truthly값을 가지고 있고, 'SH' 또한 truthly값입니다.

 

모두 truthly값일 경우 마지막 값을 반환하기 때문에 'SH'를 반환하고,  상수 userName는 'SH'를 할당받게 됩니다.

 

 

const userInput2 = '';

const userName2 = userInput2 && 'SH';

console.log(userName2); // ''출력

 

만약 상수 userInput이 빈 문자열 즉, falsy값이면 ' '(빈문자열)를 반환하고, 상수 userName2는 ' '를 할당받게 됩니다.

 

 

 

정리

AND연산자는 값이 모두 true이면, 마지막 값을 반환하고 

 

첫 번째 값이 true이고 두 번째 값이 false이면, 두 번째 값을 반환합니다.

 

첫 번째 값이 false이면, 항상 첫 번째 값을 반환합니다.