논리연산자 & 비교연산자

1️⃣ 논리연산자

논리 연산자 : 참 거짓을 반환할 때 사용하지만, 반드시 boolean 값일 필요 없다

• AND 연산자는 연산자 왼쪽과 오른쪽의 값이 모두 true이면 true, 한 쪽이라도 false이면 false 를 반환한다.
• OR 연산자는 연산자 왼쪽과 오른쪽의 값이 모두 false이면 false, 한 쪽이라도 true이면 true 를 반환한다.

A	B	A and B (A && B)	A or B (A || B)	!A
참	참	참	참	거짓
참	거짓	거짓(한쪽false)	참(한쪽true)	거짓
거짓	참	거짓(한쪽false)	참(한쪽)	참
거짓	거짓	거짓	거짓	참

둘 다 참일 때 참
둘 다 거짓일 때 거짓
참 and 거짓 일 때 거짓
참 or 거짓 일 때 참

let a = 2;

if (a < 10 || a > 18) {
  console.log('결과');
}
// 처음 참, 뒤에 거짓
// 결과적으로 참이다

let a = 2;

if (a < 10 && a > 18) {
  console.log('결과');
}
// 처음 참, 뒤에 거짓
// 결과적으로 거짓이다

2️⃣ or 연산자, 피연산자가 여러 개인 경우

result = value1 || value2 || value3;

console.log( 1 || 0 ); // 1 (1은 truthy)
console.log( null | 1); // 1 (1은 truthy)
console.log( null || 0 || 1); // 1 (1은 truthy)

console.log(undefined || null) // null 
//(falsy이기에 마지막 값 반환)
console.log(undefined || null || 0); // 0 
//(모두 falsy, 마지막 값 반환)

제일 왼쪽부터 오른쪽으로 나아감
falsy이면 마지막 값 반환

console.log(alert(1) && alert(2)); 
// 알림창 1번 O, 콘솔 undefined, 알림창 2번 X

console.log(!(alert(1)) && alert(2)); 
// 알림창 1번 O, 알림창 2, 콘솔엔 undefined
// 알림창 1번 O, !(alert(1)) → true 이기에 알림창 2번 O가 나타난다.

❓

console.log(null || 2 && 3 || 4); // 3

|| && 중에 &&가 더 우선이니깐
2 && 3 = 3 먼저 실행
→ null || 3 = 3
3 || 4 = 4 라고 생각했는데
결과값이 3으로 나옴
or연산자에서 falsy 나오면 마지막이 반환되는데
혹시 truthy이면 1번째가 나오나?

맞다
truthy 이면, 1번째 값이 나온다.

✔️연산자 우선순위
동등 ==
부등 !=
일치 ===
불일치 !==
비트 AND &
비트 XOR ^
비트 OR |
논리 AND &&
논리 OR ||
널 병합 연산자 ??
조건(삼항) ? :
할당

3️⃣ and연산자, 여러 개인 경우

result = value1 && value2 && value3;

console.log( 1 && 0); // 0
console.log( 1 && 5); // 5

console.log( null && 5); // null
// 1번째 피연산자가 falsy하면, 1번째 반환

console.log( 1 && null && undefined); 
// null

console.log(0 || null && undefined); // null
// or는 2번째가 falsy 반환 -> 0 || null
// and는 1번째가 falsy 반환 - > null || undefined

console.log((null && undefined) || 0) // 0
// null && undefined => 1번째 값 반환 // null
// null || 0 => 2번째 값 반환 // 0
// 최종 0

console.log(alert(1) || 2 || alert(3) );
// undefined
// 알림창이 1,2가 차례대로 출력되는데,...

console.log(1 || undefined && 3);
// && > ||
// 1

4️⃣ !(NOT)

result = !value;

인수 1개만 받고, 연산 수행
피연산자 불린형 변환(true/false)
방금 변환된 것을 역을 반환

console.log(!true); // false
console.log(!0); // true

console.log(!!0); // false

5️⃣ 비교연산자

비교 연산자 <, >, ===, ==, !=, !==
크다 작다 같다 같지 않다

• 동등 연산자 ==
• 일치 연산자 === : ==의 엄격한 버전
  자료형까지 확인한다

console.log(null === undefined); // false
// 자료형이 다르기 때문에 거짓 반환

console.log(null == undefined); // true

console.log(null > 0); // false
console.log(null == 0); // false
console.log(null >= 0); // true 
// null이 숫자형 0으로 반환되기 때문에 true가 나옴

느슨한 동등 연산자(==)는 타입 변환을 수행하면서 값을 비교한다.
근데 null은 undefined와만 느슨하게 같다고 평가된다
즉, 다른 값(ex. 0)과는 같지 않다.

console.log(null == undefined) // true
console.log(null == 0) // false
console.log(null === 0) // false (엄격한 비교)

만약 null을 0처럼 처리하고 싶다면,
console.log((null ?? 0) == 0); // true
널 병합 연산자(??) null을 0으로 대체한 후 비교하기 때문에 true로 나온다.

✔️아스키코드
문자를 숫자로 표현하고 있다.
순서를 표준 구격으로 나타낸 것이 1976년에 만들어진 아스키 (ASCII: American Standard Code for Information Interchange)이다

console.log("a" < "a0"); // true
console.log("a" < 0); // false

console.log("바코" < "바코0"); // true
console.log("바코0" < "바코0"); // false
console.log("바코0" < "바코10"); // true
console.log("바코100" < "바코10"); // false
console.log("바코105" < "바코101"); // false

문자열도 아스키 코드로 변환해서 숫자로 저장되는데 그 값이 길수록 더 크다고 합니다.