JavaScript 베이스캠프

논리 자료형

1. 논리 자료형 (Boolean)

논리 자료형(Boolean, 불리언) 타입은 true 또는 false 값 중 하나를 가지며, 주로 조건문(if)의 조건으로 사용됩니다.

1.1. Boolean과 연산자

1.1.1 논리 연산자

논리 연산자는 true나 false 값을 가지고 연산을 수행하는 도구입니다.

1. 논리곱 (&&) 연산자

논리곱 연산자는 두 가지 조건이 모두 참일 때만 결과가 참이 됩니다. true를 1로, false를 0으로 간주하면 논리곱 연산자는 곱셈과 같은 역할을 합니다.

console.log(true && true); console.log(true && false); console.log(false && true); console.log(false && false);

예를 들어, "비가 오고 있고, 우산을 가지고 있다"는 조건이 모두 참일 때만 "외출을 한다"는 상황을 표현할 수 있습니다. 조건문을 사용하여 다음과 같이 작성할 수 있습니다.

조건문은 뒤에서 자세히 다룰 예정이니 지금은 논리 연산자가 어떻게 사용되는지만 이해해 주세요. 문법이라 생각하지 마시고 문장이라 생각하고 읽어보세요. 영어로 표현하면, "If it is raining and I have an umbrella, I will go out. Else, I will not go out." 입니다.

let isRaining = true; let hasUmbrella = true; if (isRaining && hasUmbrella) { console.log('외출을 한다'); } else { console.log('외출을 하지 않는다'); }

2. 논리합 (||) 연산자

논리합 연산자는 두 가지 조건 중 하나만 참이어도 결과가 참이 됩니다. true를 1로, false를 0으로 간주하면 논리합 연산자는 덧셈과 같은 역할을 합니다.

console.log(true || false); console.log(false || true); console.log(false || false);

예를 들어, "비가 오거나, 눈이 온다"는 조건 중 하나라도 참이면 "외출을 하지 않는다"는 상황을 아래와 같이 표현할 수 있습니다.

let isRaining = true; let isSnowing = false; if (isRaining || isSnowing) { console.log('외출을 하지 않는다'); } else { console.log('외출을 한다'); }

3. 논리부정 (!) 연산자

논리부정 연산자는 "아니다"라는 의미를 가지고 있습니다. 조건이 참이면 거짓으로, 거짓이면 참으로 바꿉니다. 예를 들어, "비가 오지 않는다"는 상황에서는 비가 오는지 여부를 반대로 말하는 것입니다.

논리부정 연산자의 경우 두 번 사용하여 true값이나 false값을 반환할 수 있습니다. 이 연산자는 해당 값이 truthy인지 falsy인지를 판단할 때 사용됩니다. truthy와 falsy는 자바스크립트에서 참으로 간주되는 값과 거짓으로 간주되는 값을 말합니다. 자바스크립트에서는 특정 값이 조건문에서 true 또는 false로 평가되는데, 이를 truthy와 falsy라고 합니다. 예를 들어, 숫자 0, 빈 문자열, null, undefined, NaN은 falsy로 평가되고, 나머지 모든 값은 truthy로 평가됩니다. 이는 자바스크립트에서 조건문을 작성할 때 매우 유용합니다.

console.log(!true); // false (참을 거짓으로 바꿈) console.log(!false); // true (거짓을 참으로 바꿈) console.log(!!true); // true (참을 두 번 부정해서 다시 참이 됨) console.log(!!false); // false (거짓을 두 번 부정해서 다시 거짓이 됨) console.log(!!undefined); // false (undefined는 거짓으로 간주됨) console.log(!!null); // false (null은 거짓으로 간주됨) console.log(!!NaN); // false (NaN은 거짓으로 간주됨)

예를 들어, 아래처럼 변수에 0을 넣고 조건문에서 이를 그대로 활용했을 때 어떻게 동작하는지 확인해보세요. 이처럼 truthy와 falsy를 이해하면 조건문을 작성할 때 더 효율적으로 코드를 작성할 수 있습니다.

let num = 0; if (num) { console.log('참'); } else { console.log('거짓'); }

1.2 undefined

undefined는 변수가 값이 할당되지 않은 경우를 가리키는 데이터 타입입니다. 즉, 해당 변수에 아무런 값도 할당되지 않았거나, 정의되지 않은 변수에 접근하려고 할 때 undefined가 반환됩니다.

다만 위니북스에서는 undefined를 출력하지 않습니다. 따라서 아래 코드는 콘솔에서 확인해주세요.

let a; console.log(a); // undefined

1.3 null

null은 값이 없음을 나타내는 데이터 타입입니다. 이 값을 사용하여 변수에 값을 지정하지 않도록 초기화 할 수 있습니다.

let value1; // undefined let value2 = null; console.log(value2); // null

undefined는 변수가 선언되었지만 값이 지정되지 않은 경우를 나타내며, null은 어떤 값이 의도적으로 비어있음을 표현하기 위해 사용합니다.

값이 비어있음을 나타내기 위해 undefined를 사용해서는 안 되나요?

null은 초기화하려는 특정한 목적으로 의도적으로 사용한다고 앞서 말씀드렸습니다. 하지만 undefined를 사용하는 것은 어떨까요?

의미적으로는 부적절합니다. undefined는 선언된 변수에 아직 값이 할당되지 않았음을 의미하기 때문입니다. 하지만 실제 값을 초기화하기 위한 방법으로 null을 사용하든 undefined를 사용하든 상관없습니다. 자바스크립트의 메모리를 관리해주는 프로그램인 가비지 컬렉터는 null과 undefined를 구분하지 않습니다.