좌항의 값이 undefined 이면 우항의 값을 보여주고 싶다.

연산자 || 와 ??를 섞어서 썼는데, 언제든 원하는 결과를 얻었다.

const result = undefined || '이거 반환하자';
console.log(result); // "이거 반환하자"

const result = undefined ?? '이거 반환하자';
console.log(result); // "이거 반환하자"

좌항의 값이 빈 문자열(‘’) 이면 우항의 값을 보여주고 싶다.

이상하다

const result = '' || '이거 반환하자';
console.log(result); // "이거 반환하자"

const result = '' ?? '이거 반환하자';
console.log(result); // ""

||, ??를 제대로 알지 못하고 막 썼구나.

논리곱(||)

논리곱은 OR이다. OR는 피연산자 중 하나라도 참이면, 결과는 참이다. 참인 값을 찾으면, 그 이후의 값은 확인해보지 않아도 결과가 참이라는 것은 변하지 않는다.

즉, 첫 번째 참인 값(truthy)을 찾으면 그 값을 반환한다.

truthy를 찾지 못하면, 마지막 피연자를 반환한다.

논리합(&&)

논리합은 AND이다. AND는 피연산자 중 하나라도 거짓이면, 결과는 거짓이다. 거짓인 값을 찾으면, 결과는 무조건 거짓이다.

즉, 첫 번째 거짓인 값(falsy)을 찾으면 그 값을 반환한다.

falsy를 찾지 못하면, 마지막 피연자를 반환한다.

javascript에서 falsy값

  • false
  • undefined
  • null
  • 0, -0
  • NaN
  • ’‘(빈 문자열)

null 병합 연산자(??)

좌항의 피연산자가 null 또는 undefined인 경우, 우항 피연산자 반환

그렇지 않은 경우, 좌항 피연산자 반환

뭘 몰랐을까

?? 연산자도 falsy값을 판단하는 연산자라고 생각했다.

하지만 ?? 연산자는 좌항이 null과 undefined 일 때만 우항을 반환하기 때문에 좌항이 falsy값인 빈 문자열(‘‘)일지라도 빈 문자열을 그대로 반환한다.

|| 연산자는 좌항에 falsy값인 빈 문자열(‘‘)이 오면 우항을 반환하게 된다.

이제 언제 좌항이 반환되고 우항이 반환될지 우왕좌왕하지 않을 것만 같다.