단락 평가(Short-Circuit Evaluation) => 기본값 설정(default value assignment)

 

단락 평가(short-circuit evaluation)

개요

const nextRating = Number(e.target.value) || 0;

Number(e.target.value)에 값이 없을 경우 기본값을 0으로 설정.

 

단락 평가(short-circuit evaluation)

이 문법은 **"단락 평가(short-circuit evaluation)"**를 활용한 "논리 OR 연산자(||)를 이용한 기본값 설정(default value assignment)" 패턴입니다.

 

1. 단락 평가 (Short-Circuit Evaluation)

|| 연산자는 왼쪽 값이 Falsy(거짓 같은 값)면 오른쪽 값을 반환합니다.
따라서 Number(e.target.value)가 NaN(Falsy)이면 0을 반환합니다.

 

2. 논리 OR 연산자를 이용한 기본값 설정

이 패턴은 JavaScript에서 Falsy 값일 때 기본값을 설정하는 방식으로 자주 사용됩니다.

const value = userInput || "기본값";

userInput이 null, undefined, "", 0, false, NaN이면 "기본값"을 사용합니다.

 

최근 대체 문법: Nullish Coalescing Operator (??)

||는 0, "", false 같은 값도 Falsy로 취급하여 기본값을 설정해버리는 문제가 있습니다.

이를 해결하기 위해 **??(Nullish 병합 연산자)**를 사용할 수 있습니다.

const nextRating = Number(e.target.value) ?? 0;

 

• ??는 null이나 undefined일 때만 오른쪽 값을 사용하므로, 0이나 "" 같은 값은 유지됩니다.
• ||보다 더 정교한 기본값 설정이 가능합니다.

 

결론 및 요약

 

• ||는 **단락 평가(Short-Circuit Evaluation)**를 활용한 기본값 설정 패턴입니다.
• 최신 JS에서는 ??(Nullish 병합 연산자)를 사용하면 더 정확한 처리가 가능합니다.