자바스크립트 빈값 체크
자바스크립트 빈 값들인 "", null, undefined, 0, NaN 가 false를 return 한다는 것을 알고 계셨나요!?
코드를 보며 설명을 드리고, 위 빈값들과 배열, 객체의 빈값을 한번에 체크할 수 있는 소스를 소개 하려 합니다.
Javascript |
이렇게 "" 과 null 그리고 undefined를 초기값으로 주고
if문 안에 넣게 되면 각각의 값들은 false를 return하게 되어 비어있다는 log를 확인할 수 있습니다. |
Console |
이렇게 간단히 값을 체크하고자 할 때는 위의 코드를 사용하셔도 됩니다. |
다만 ! 주의할 점들이 있습니다.
1) 숫자 0 같은 경우에 if문 안에서 false를 return하기에 아래와 같이 숫자 0이 원하는 값임에도 불구하고
false가 나오는 경우가 발생하게 됩니다.
Javascript |
|
Console |
|
2) 비어 있는 배열과 빈 객체에 대해서 리턴값을 false로 해주지 않습니다.
Javascript |
|
Console |
|
※ 따라서 숫자 0 및 배열, 객체의 빈값도 전부 체크가 하고 싶을 경우엔
Javascript |
|
Console |
|
이와 같이 해주시면 모든 값들을 체크할 수 있습니다.
정리를 하면 변수의 값이 문자열이라는 것이 확신이 들면 변수명만으로 빈 값 체크 가능
But, 배열이나 객체까지도 빈 값을 체크하고 싶을 경우 따로 조건을 주어 체크를 해주어야 한다.
<script> var isEmpty = function(val) { if (val === "" || val === null || val === undefined || (val !== null && typeof val === "object" && !Object.keys(val).length) ){ return true } else { return false } }; var binArryAval = []; var binObjVal = {}; if (isEmpty(binArryAval)){ console.log("binArryAval 는 비어 있습니다."); } else { console.log("binArryAval 는 값이 들어 있습니다."); } if (isEmpty(binObjVal)){ console.log("binObjVal 는 비어 있습니다."); } else { console.log("binObjVal 는 값이 들어 있습니다."); } </script> |
'웹개발 > 프론트관련' 카테고리의 다른 글
[외부 JS] 달력 관련 JS (Fullcalendar) (0) | 2018.08.05 |
---|---|
[JSP] 나만의 커스텀 태그 만들어 효율적인 작업을 하자 (1) | 2018.06.10 |
[JavaScript] 배열 다루기 (map, reduce, filter 등) (0) | 2018.05.29 |
[오픈소스] chartjs를 이용한 차트 (0) | 2018.05.27 |
[Ajax] AJAX 데이터 간단한 한글처리 (produces) (0) | 2018.05.22 |