일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- PowerMock
- javascript
- Coveralls
- ECMAScript2015
- ATOM
- AWS
- Gitbook
- Code-coverage
- python
- sanghaklee
- Travis CI
- Unit-test
- GIT
- dict
- NPM
- {}
- primitive type
- REST
- RESTful
- JaCoCo
- java
- Linux
- 인프런
- sinopia
- node.js
- ubuntu
- nginx
- API
- 개인정보수정
- Lodash
- Today
- Total
이상학의 개발블로그
[JavaScript] Null check, 빈 값 체크 v2019 본문
Introduction
[JavaScript] Null check, 빈 값 체크 필자의 블로그 중 가장 조회수가 많은 글이다.
세 번째 게시글인 만큼 블로그 초장기에 작성한 내용이다.
시간이 지나 다시 내용을 보니 부족한 점과 잘못된 점이 있었다.
이 부분을 바로잡기 위해 다시 쓰는 글이다.
isEmpty
gist
에 공유한 isEmpty는 문제점이 있다. 그 당시엔 왜 그렇게 생각했는지 기억이 나지 않지만, 입력 값 false
에 대해서 비어있지 않다는 false를 리턴하도록 했다.
하지만, isEmpty는 파라미터의 비교 연산 시 true|false
를 반환하느냐에 대한 내용이 아니다.
넘어온 파라미터가 비어 있냐는 것이다.
그래서 의도한 기능대로 동작하는 isEmpty
를 다시 작성했다.
is-
로 시작하는 함수 관리하기 위해 is
라는 NPM 모듈로 만들었다.
is
https://github.com/SangHakLee/is
https://sanghaklee.github.io/is
const empty = (value) => {
if (value === null) return true
if (typeof value === 'undefined') return true
if (typeof value === 'string' && value === '') return true
if (Array.isArray(value) && value.length < 1) return true
if (typeof value === 'object' && value.constructor.name === 'Object' && Object.keys(value).length < 1 && Object.getOwnPropertyNames(value) < 1) return true
if (typeof value === 'object' && value.constructor.name === 'String' && Object.keys(value).length < 1) return true // new String()
return false
}
빈 값
isEmpty
는 파라미터 값이 비었는지 확인한다. 빈 값이라 정의한 값들은 아래와 같다.
- String
''
new String()
- `` Template literals
${''}
Template literals
- Array
[]
new Array()
- Object
{}
new Object()
new Proxy({}, {})
Proxy
- null
null
- undefined
undefined
채워진 값
1
'string'
[1]
{a:1}
- 의심의 여지가 없는 명확하게 채워진 값들이다.
true
false
boolean
도 값이다. 특히false
도 값이다.
Object
Object
는 까다롭다.
new Boolean() // Boolean{false}
false // false
typeof new Boolean() // object
typeof false // boolean
typeof new Boolean() != typeof false
new Boolean() == false
new
로 생성하면 타입은object
지만 값으로 비교할 땐 false이다.new Boolean()
로 생성하면 Objectfalse
등 리터럴로 생성하면 Primitive
- 자바스크립트의 원시 타입(Primitive Type)
- https://stackoverflow.com/questions/17256182/what-is-the-difference-between-string-primitives-and-string-objects-in-javascript
new Boolean() // Boolean{false}, == false
new Number() // Number{0}, == 0
new Date() // Thu Jun 27 2019 00:59:56 GMT+0900 (한국 표준시)
new RegExp() // /(?:)/
new Error() // Error at <anonymous>
- 위 객체들은 자명하게 값을 리턴
- JavaScript는 6가지 Primitive를 제외하면 모두 Object
new Object()
를 제외한 모든 Object는 값이 채워졌다고 판단
Test Data-set을 보면 필자가 어떤 값들을 빈 값이라 보고 어떤 값들을 채워진 값이라 보는지 알 수 있다.
Underscore.js & Lodash
Underscore.js, Lodash에는 isEmpty
가 이미 존재한다.
map을 두고 .map을 쓸 정도로 Undederscore.js를 선호하는 필자가 _.isEmpty 를 사용하지 않는 이유가 있다.
필자가 원하는 것은 파라미터의 값이 비었는지 확인하는 것이다. 하지만, _.isEmpty
는 필자의 의도와 다르게 동작한다.
boolean
return true- _.isEmpty(true)
number
return true- _.isEmpty(1)
object created with new, except new Object()
true- _.isEmpty(new Date())
function
return true- _.isEmpty(function() {})
필자는 앞에서 빈 값이라 정의한 파라미터를 제외한 모든 경우를 채워진 값으로 판단하고 싶었다.
JavaScript로 데이터를 다루다 보면 이렇게 처리해야 하는 경우가 꽤 생긴다.
이러한 요구 때문에 Underscore.js, Lodash의 _.isEmpty
를 사용하지 않고 새로 만들어서 사용했다.
Conclusion
요구사항에 따라서 비어 있다라는 개념은 바뀔 수 있다.
어떤 경우엔 Underscore.js, Lodash의 _.isEmpty
가 적합할 수 있고, 어떤 경우엔 필자의 is.empty
가 적합할 수 있다.
필자의 모듈이나 Underscore.js 모듈을 활용해서 각 상황에 맞는 isEmpty
를 만들어 사용하자.
'JavaScript' 카테고리의 다른 글
[JavaScript] 원시 타입과 참조 타입 질문 1 (0) | 2020.10.07 |
---|---|
[ECMAScript6 / ES6] 아름다운 JavaScript를 위한 ES6 (0) | 2017.11.24 |
[JavaScript] 객체 프로퍼티 접근, 참조 타입과 배열 확인 (0) | 2016.08.03 |
[JavaScript] 내장 타입 인스턴스화 (0) | 2016.07.26 |
[JavaScript] 원시 타입과 참조 타입 (2) | 2016.04.13 |