JS Falsy, Nullish

박세영·2022년 8월 22일
0

Falsy

JS는 문맥에 따라 형변환(coercion)이 발생한다. Falsy한 값은 Boolean context에서 false로 간주된다.

아래는 JS에서 Falsy한 값이다.

  • false
  • 0
  • -0
  • 0n
  • "", '', ``
  • null
  • undefined
  • NaN

! (negation operator)를 적용하면 boolean으로 coercion된다. 이런 특성을 응용해 !!를 적용하면 값의 Truthy 값을 얻을 수 있다.

Nullish

Nullish한 값은 JS에서 명시적 혹은 암시적으로 비어 있는 값이다. Nullish한 값으로는 null 그리고 undefined이 있다.

Nullish한 값은 Falsy 하지만, 그 역은 성립하지 않는다. 따라서 Nullish한 값을 검증할 때,

if(!Nullish) { // }

와 같은 방식으로 작성해서는 안된다.

유효한 방법은 아래와 같다.

if (temp !== undefined && temp !== null) { // }
if(temp ?? false) { // }

Nullish coalescing operator

Nullish 병합 연산자 ??를 통해서 Nullish한 값을 default value로 치환할 수 있다. 연산자 기준 좌변이 Nullish한 경우 우변으로 평가된다.

const foo = null ?? 'default string';
console.log(foo);
// expected output: "default string"

const baz = 0 ?? 42;
console.log(baz);
// expected output: 0

Nullish in TS

strictNullChecks

타입스크립트 설정 옵션 중 하나이다. 해당 옵션을 off한 경우(바닐라 JS의 디폴트) nullish한 값에 접근할 수 있다. 즉 객체의 경우 선언되지 않은 프로퍼티에 접근할 수 있다.

strictNullChecks 옵션이 on인 경우, 프로퍼티나 메서드에 접근하기 이전에 nullish한지 검사해야 한다.

function doSomething(x: string | null) {
  if (x === null) {
    // do nothing
  } else {
    console.log("Hello, " + x.toUpperCase());
  }
}

Non-null assertion operator

ts에서 타입에 존재하는 nullundefiend를 제거하는 후위 연산자이다.

function liveDangerously(x?: number | null) {
  // No error
  console.log(x!.toFixed());
}

0개의 댓글