Array에서 NaN, undefined, null 제거하기

🏃 array 요소에 NaN, undefined, null와 같은 유효치 않은 값을 제거해보자!

1. 전체 코드 보기

• 코드는 아래와 같이 간단하다. 배열에 대해 filter()와 Boolean를 사용해주면 된다.

function getValidArr(arr) {
  return arr.filter(Boolean);
}

const arr = [NaN, undefined, '', 0, false, null];
console.log(getValidArr(arr));   // []

2. 코드 상세보기

(1) Boolean(), 값을 true, false로 반환

• JS에서 유효치 않은 값은 NaN, undefined, ‘’, 0, false, null이 존재한다.
• 우리는 배열에서 이 값을 전부 제외하고자 한다.

const arr = [NaN, undefined, '', 0, false, null];    

• 그럼 이 값들이 공통적인 조건을 가져야할텐데 이들의 공통점은 무엇인가?
• 바로 Boolean으로 변환하면 false가 된다는 점이다.
• Boolean()은 특정 값을 참, 거짓으로 반환해준다.

Boolean(NaN);        // false
Boolean(undefined);  // false
Boolean('');         // false
Boolean(0);          // false
Boolean(false);      // false
Boolean(null);       // false

(2) filter() 사용하기

• array에서 특정 조건에 해당하는 원소만 모으고 싶다면 filter()를 사용할 수 있다.
• filter()는 callback을 true로 통과한 원소를 모아 새로운 배열을 만들어준다.

array.filter(callback);

• 앞서 살펴본 Boolean과 filter를 같이 사용해주자!
• 아래 함수는 Boolean으로 변환시 false인 원소를 제외한 값들로 새 배열을 만들어준다.

function getValidArr(arr) {
  return arr.filter(Boolean);
}