Boolean 타입 (볼린형, 논리타입), 비교연산자, 논리연산자
- -
Boolean 타입 (볼린형, 논리타입)
Boolean - JavaScript | MDN
Boolean 객체는 불리언 값을 감싸고 있는 객체입니다.
developer.mozilla.org
불린형(논리 타입)은 true와 false 두 가지 값밖에 없는 자료형이며 불린형은 긍정이나 부정을 나타내는 값을 저장할 때 사용한다. 컴퓨터과학에서 주로 참은 1, 거짓은 0에 대응하나 언어마다 차이가 있다. 숫자를 쓰지 않고 참과 거짓을 나타내는 영단어 true와 false를 쓰기도 한다.
Javascript에서 불리언 조건은 어떤 코드 부문이 실행되어야 할 지(예를 들어 if 절 안에서) 또는 어떤 코드 부문을 반복해야 할지(예를 들어 for 문 안에서) 결정하는 데 사용한다.
true;
false;
/* JavaScript if문 */
if (boolean conditional) {
// 조건이 참일 경우 실행되는 코드
}
if (boolean conditional) {
console.log("boolean conditional resolved to true");
} else {
console.log("boolean conditional resolved to false");
}
/* JavaScript for 루프 */
for (control variable; boolean conditional; counter) {
// 조건이 참일 경우 반복해서 실행할 코드
}
불린값은 비교 결과를 저장할 때도 사용된다. 아래 예시처럼 isFreater변수에 4가 1보다 큰값이다 라고 할당하고 alert로 확인하면 true값이 나오는걸 볼 수 있다.
let isGreater = 4 > 1; // 정수 4는 정수 1보다 큰 값이다.
alert( isGreater ); // true (비교 결과: "yes")
falsy 값
불리언 타입은 아니지만, 자바스크립트에서 false로 “여겨지는” 값이 일부 있는데, 이를 falsy 값이라고 합니다. 반대로 true로 “여겨지는” 값은 truthy 값이라고 합니다. truthy 값은 매우 많아서, falsy 값을 암기하면 구분하기 쉽다.
// 대표적인 falsy 값
false
0
-0
0n
""
''
``
null
undefined
NaN
비교연산자(comparison operator)
불리언은 비교연산자(comparison operator)로 두 값이 같은지 다른지를 확인할 때 유용하다.
- 보다 큼·작음: a > b, a < b
- 보다 크거나·작거나 같음: a >= b, a <= b
- 같음(동등): a === b. 등호 =가 세 개 연달아 오는 것에 유의. a = b와 같이 등호가 하나일 때는 할당을 의미한다.
- 같지 않음(부등): 같지 않음을 나타내는 수학 기호 ≠는 자바스크립트에선 a != b로 나타냅니다. 할당연산자 = 앞에 느낌표 !를 붙여서 표시합니다.
비교 연산자설명
== | 왼쪽 피연산자와 오른쪽 피연산자의 값이 같으면 참을 반환함. |
=== | 왼쪽 피연산자와 오른쪽 피연산자의 값이 같고, 같은 타입이면 참을 반환함. |
!= | 왼쪽 피연산자와 오른쪽 피연산자의 값이 같지 않으면 참을 반환함. |
!== | 왼쪽 피연산자와 오른쪽 피연산자의 값이 같지 않거나, 타입이 다르면 참을 반환함. |
같음 연산자 ( ==, ===)
같음 연산자의 평가 결과는 항상 Boolean 형으로 비교가 참인지 나타냅니다.
식 및 연산자 - JavaScript | MDN
이 장은 JavaScript의 모든 연산자, 식 및 키워드를 나열합니다.
developer.mozilla.org
==동등 연산자. | !=부등 연산자. | === (en-US)일치 연산자. | !== (en-US)불일치 연산자. |
동치 비교 및 동일성 ( 자바스크립트 === 과 == 의 차이)
동치 비교 및 동일성 - JavaScript | MDN
ES2015에는 4가지 같음(equality) 알고리즘이 있습니다:
developer.mozilla.org
===를 사용하는 엄격한 같음
=== , !== : 엄격한 동치 연산자 두 피연산자의 값과 타입이 같으면 true, 다르면 false 를 반환합니다. 엄격한 동치 연산자는 보이는 값이 같아도, 두 값의 타입이 다르면 false 가 됩니다.
123 === (100 + 23); // true ("123의 값과 100 + 23의 값은 같다."는 사실이기 때문에 true)
123 === '123'; // false ("123의 값과 '123'의 값은 같다."는 사실이 아니기 때문에 false)
123 !== (100 + 23); // false ("123의 값과 100 + 23의 값은 같지 않다."는 사실이기 아니기 때문에 false)
123 !== '123'; // true ("123의 값과 '123'의 값은 같지 않다."는 사실이기 때문에 true)
==를 사용하는 느슨한 같음
==, != : 느슨한 동치 연산자 느슨한 동치 연산자는 “대체로” 타입이 달라도 값이 같으면 true, 다르면 false를 반환합니다. 이렇게 “느슨하게” 동치 여부를 판단하기 때문에 예외가 많아 현대 웹 개발에서는 사용을 권장하지 않습니다. 참고로 다른 프로그래밍 언어에서는 == , != 를 주로 사용하는데, JavaScript에서는 ===, !== 로 비교해야 합니다.
== 은 사용하지 않는다고 한다. 그냥 그런게 있구나 하고 넘어가도록.
12 == '12' // true
관계 연산자(>, >=, <, <=)
식 및 연산자 - JavaScript | MDN
이 장은 JavaScript의 모든 연산자, 식 및 키워드를 나열합니다.
developer.mozilla.org
비교 연산자는 피연산자를 비교하고, 비교가 참인지 여부를 나타내는 Boolean 값을 반환합니다.
> | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크면 참을 반환함. |
>= | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크거나 같으면 참을 반환함. |
< | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작으면 참을 반환함. |
<= | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작거나 같으면 참을 반환함. |
in in 연산자는 객체에 주어진 속성이 있는지를 결정합니다. | instanceof instanceof 연산자는 객체가 다른 객체의 인스턴스인지 판별합니다. |
< (en-US)작음 연산자. | > (en-US)큼 연산자. | >= (en-US) 크거나 같음 연산자. |
<= (en-US) 작거나 같음 연산자. |
100 > 200; // false ("100은 200보다 크다."는 거짓)
200 > 100; // true ("200은 100보다 크다."는 참)
100 >= 100; // true ("100은 100보다 크거나 같다."는 참)
200 <= 100; // false ("200은 100보다 작거나 같다."는 거짓)
논리연산자(logical operator)
표현식과 연산자 - JavaScript | MDN
이번 장에서는 JavaScript의 표현식과 함께 할당, 비교, 산술, 비트 계산, 논리, 문자열, 삼항 등 다양한 연산자를 살펴보겠습니다.
developer.mozilla.org
자바스크립트엔 세 종류의 논리 연산자 ||(OR), &&(AND), !(NOT)이 있습니다.
연산자에 '논리’라는 수식어가 붙긴 하지만 논리 연산자는 피연산자로 불린형뿐만 아니라 모든 타입의 값을 받을 수 있습니다. 연산 결과 역시 모든 타입이 될 수 있습니다.
&& | 논리식이 모두 참이면 참을 반환함. (논리 AND 연산) |
|| | 논리식 중에서 하나라도 참이면 참을 반환함. (논리 OR 연산) |
! | 논리식의 결과가 참이면 거짓을, 거짓이면 참을 반환함. (논리 NOT 연산) |
|| : 논리합 (OR) ‘OR’ 연산자는 두 개의 수직선 기호로 만들 수 있습니다.
두 값 중 하나만 true 여도 true 로 판단합니다.
true || false; // true
false || true; // true
100 > 200 || 200 > 100; // true ("100은 200보다 크다" 혹은 "200은 100보다 크다" 중 하나는 true)
두 값이 모두 false 면 false 로 판단합니다.
false || false // false
200 < 100 || 20 < 10; // false
&& : 논리곱(AND) 두 개의 앰퍼샌드를 연달아 쓰면 AND 연산자 &&를 만들 수 있습니다.
두 값이 모두 true 면 true 로 판단합니다.
true && true // true
200 > 100 && 20 > 10; // true
두 값 중 하나만 false 여도 false 로 판단합니다.
true && false // false
false && true // false
100 > 200 && 200 > 100; // false
var o1 = true || true; // t || t는 true 반환
var o2 = false || true; // f || t는 true 반환
var o3 = true || false; // t || f는 true 반환
var o4 = false || (3 == 4); // f || f는 false 반환
var o5 = 'Cat' || 'Dog'; // t || t는 Cat 반환
var o6 = false || 'Cat'; // f || t는 Cat 반환
var o7 = 'Cat' || false; // t || f는 Cat 반환
논리 부정 연산자(!)의 경우, 사실 관계를 반대로 표현합니다.
! : 부정(NOT)
오른쪽 피연산자와 반대의 사실을 반환합니다. 단일 피연산자를 true로 변환할 수 있으면 false를 반환합니다. 그 외에는 true를 반환합니다.
!true // false
!(100 > 200) // true
var n1 = !true; // !t는 false 반환
var n2 = !false; // !f는 true 반환
var n3 = !'Cat'; // !t는 false 반환
falsy, truthy의 반대 값을 반환합니다.
!0 // true
!'' // true
!1 // false
!'코드스테이츠' // false
'프론트엔드 공부 > 자바스크립트' 카테고리의 다른 글
반복문 for, while, do while (0) | 2022.12.22 |
---|---|
조건문 if, else, else if (ft.조건에 필요한 연산자) (0) | 2022.12.19 |
String 타입(문자형) (0) | 2022.12.17 |
Number 타입(숫자형) (0) | 2022.12.17 |
JavaScript 개요, 변수와 상수, 변수명 작성법 (0) | 2022.12.17 |
소중한 공감 감사합니다