[Typescript] hasText

• 타입스크립트에서 StringUtils.hasText를 어떻게 만들까
• 구현하며 알게된 타입스크립트 문법들

function hasText (str?: string | null): boolean {
    return !!str?.trim()
}

주요 문법

• Optional Chaining(?.)
  • str이 null 또는 undefined일 경우 바로 undefined를 반환
  • null 또는 undefined이 아니면 trim()을 실행해 양 끝의 공백을 제거한 문자열 반환
• **!!**
  • 부정 연산자 !를 두 번 사용
  • Optional Chaining의 결과로 나온 null, undefined를 boolean타입인 false로 변환
  • trim()으로 만들어진 문자열은
    • 빈 문자열("")이라면 false
    • 문자를 가진 문자열이면 true

기타

• 위에서 구현한 hasText와는 상관 없는 내용이지만 !!를 잘못 사용하다 고생했던 버그

function foo(val: boolean) {
    return !!val
}

foo(dto.flag) // dto.flag의 값 그대로 반환

• 의도는 dto.flag의 값을 그대로 반환
• 그런데 dto.flag가 true/false 상관없이 그대로 true 반환하는 경우 발생
• 원인 : dto 시리얼라이즈 과정에서 flag가 boolean 타입이 아니라 string 타입변환...
  • !문자열은 false, !!문자열은 true가 된다.
  • !!"false"처럼 false가 문자열이라서 계속 true가 반환됨
    • !"false" -> false
    • !false -> true

참고

• MDN Web Docs - 논리적 NOT (!)

!!true; // !!truthy는 true를 반환합니다.
!!{}; // !!truthy는 true를 반환합니다. 임의의 object는 참 같은 객체입니다.
!!new Boolean(false); // .valueOf()에서 false값을 가지는 불리언 객체도요!
!!false; // !!falsy는 false를 반환합니다.
!!""; // !!falsy는 false를 반환합니다.
!!Boolean(false); // !!falsy는 false를 반환합니다.

---

• 아직 typescript에서 생소한 용어가 많다 : truthy, falsy
• function vs lambda로 함수 정의하는 것의 차이점도 추후 정리해봐야겠다.