자바스크립트 NaN, undefined, null

파이썬에서 데이터를 처리하다 보니 이게 빈 문자열(“”)인지 None인지 NaN 인지 구분하는 과정이 중요하다는 생각이 들었습니다. 그래서 자바스크립트를 공부하면서 나온 NaN, undefined, Null도 잘 구분하고 처리하는 게 중요하다는 생각이 들었습니다.

이번 포스트에서는 자바스크립트에서 NaN과 undefined, Null은 무엇을 나타내고 어떻게 판별하고 처리할 수 있는지 정리해보았습니다.

NaN, undefined, null

NaN

Not a number의 약자 입니다.

이는 객체의 값이 숫자가 아님을 나타내는 데 사용됩니다.

이 오류를 생성할 수 있는 방법은 여러 가지가 있습니다.

하나는 명시적으로 NaN를 할당하는 방법이며 다른 방법은 0/0 또는 sqrt(-1)와 같은 유효하지 않은 수학 연산을 하는 것 입니다.

let nanVar = 0/0;
console.log(nanVar);  // NaN

let nanVar2 = NaN;
console.log(nanVar2);  // NaN

undefined

이는 객체에 값이 정의되지 않음을 의미합니다.

이는 변수를 생성하고 변수에 값을 할당하지 않을 때 발생합니다.

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

null

이는 개체가 비어 있고 메모리 주소를 가리키고 있지 않음을 의미합니다.

null은 함수에서 반환 값이 없거나, 변수나 객체를 초기화할 때 사용합니다.

// 함수에서 반환 값이 없음을 나타내는 경우
function doSomething() {
    // some logic without a meaningful return value
    return null;
}


// 객체의 속성이나 변수를 초기화하는 경우
let myObject = {
    property1: "value1",
    property2: "value2"
};

myObject.property1 = null;


// 변수를 초기화
let myVariable = "some value";

myVariable = null;

NaN 판별

isNaN 함수 사용

isNaN 함수는 주어진 값이 NaN인지 여부를 판별합니다. 그러나 이 함수는 숫자가 아닌 모든 값에 대해 true를 반환하므로 조심해야 합니다.

console.log(isNaN(NaN));        // true
console.log(isNaN(123));        // false
console.log(isNaN("Hello"));    // true

Number.isNaN() 함수 사용

Number.isNaN() 함수는 isNaN()과 유사하지만, NaN이면서도 숫자인 경우에만 true를 반환합니다.

let value1 = 10/"String value";
let value2 = "String value";

console.log(Number.isNaN(value1));  // true
console.log(Number.isNaN(value2));  // false

엄격한 비교 연산자 (===) 사용

NaN은 자기 자신과도 동일하지 않습니다. 따라서 === 연산자를 사용하여 NaN을 검사할 수 있습니다.

let myVar = NaN;
console.log(myVar !== myVar);  // true (NaN과의 비교는 항상 true)

배열에서 NaN 제거

배열에서 NaN을 제거하려면 filter()함수와 isNaN() 함수를 사용할 수 있습니다.

let numberArr = [1, 2, 3, NaN, 4];
let filteredArr = numberArr.filter(num => !isNaN(num));

console.log(filteredArr);  // [ 1, 2, 3, 4 ]

Undefined 판별

typeof 연산자 사용

typeof 연산자는 변수의 데이터 타입을 반환합니다. undefined인 경우 문자열 “undefined”를 반환하며, NaN은 숫자 타입입니다.

console.log(typeof undefinedVariable);  // "undefined"
console.log(typeof NaN);               // "number"

typeof 변수 === “undefined”로 값을 할당하지 않은 변수를 확인 할 수 있습니다.

let myVar;
console.log(typeof myVar === "undefined");  // true

엄격한 비교 연산자 (===) 사용

let undefinedVariable;
console.log(undefinedVariable === undefined);  // "undefined"

배열에서 undefined 제거

배열에서 undefined을 제거하려면 filter()함수를 사용할 수 있습니다.

let values = [1, undefined, 3, undefined, 5];
let filteredValues = values.filter(val => val !== undefined);

console.log(filteredValues);  //[1, 3, 5]

null 판별

엄격한 비교 연산자 (===) 사용

let myVariable = null;
console.log(myVariable === null);  // true

참고할만한 글

Leave a Comment

목차