본문 바로가기
Today I Learned/SeSAC 웹 2기

[새싹x코딩온] JS 유효성 검사 (value === '') 과 (!value)는 같은 의미일까?

by suyeonnie 2024. 11. 12.

 
 
방명록 유효성 검사 부분 중 작성자 또는 내용을 입력하지 않으면 알람을 띄우는 부분에서 조건을 `writerValue===''`로 작성했다.
 

//유효성 검사: 빈 입력값이 있으면 알림 표시
        if (writerValue === '' || contentValue === '') {
          alert('작성자와 내용을 모두 입력해주세요');
          return;
        }

 
어...? 그런데 `writerValue===''`와 `!writerValue`는 같은 의미일까?
 

// 유효성 검사: 빈 입력값이 있으면 알림 표시
    if (!writerValue || !contentValue) {
      alert("작성자와 내용을 모두 입력해 주세요.");
      return;
    }

 
`writerValue===''`는 `!writerValue`와 비슷한 의미를 가지고 있지만 엄밀하게는 조금 다르다.
 
내가 작성한 `writerValue===''`는 값이 빈 문자열일 때만 true를 반환하고, `!writerValue`는 값이 Falsy 값(거짓으로 평가되는 값)일 때 true를 반환한다.
 
Falsy 값에는 `0`, `null`, `undefined`, `false`, `''`(빈 문자열)이 포함되어 빈 문자열 뿐만 아니라 다른 falsy값도 함께 확인한다. html의 입력 필드에  flasy값이 들어가는 경우 드물지만, JavaScript에서는 데이터를 변환하거나 초기화할 때  null, undefined, NaN과 같은 값이 발생하는 경우도 있다고 한다....
 
아직 와닿지는 않는데...그렇다고 한다. falsy값이 뭐가 있는지 기억하자.