모던 자바스크립 Deep Dive) 9장 타입변환과 단축평가

엄강우·2022년 12월 26일

9장

명시적 타입 변환

var x = 10
var strX = x.toString() // '10'

암묵적 타입 변환

var x = 10
var strX = 10 + ''   // '10'
var x = +strX // 10

5 * '10'  // 50
1 + '10' // '110'
!0 // true
!!0 // false

암묵적 타입 변환이 명시적 타입변환보다 짧게 활용할 수 있지만 다른 사람이 보았을때도 어떤 의도를 가지고 암묵적 타입변환을 이용했는지에 대해 알 수 있어야 한다.

truthy & falsy

  • Truthy한 값들
    • 0을 제외한 숫자
    • ''을 제외한 문자열
    • 객체
  • Falsy한 값들
    • 0
    • ''
    • null
    • undefined

truthy한 값들과 falsy한 값을 각 각 false와 true로 변환 시키려면 !!를 앞에 붙히면 됩니다.

단축 평가

논리 연산자가 모든 연산을 수행하지 않고 결과 값을 도출하는 것을 의미한다.

function doSomething() {
  console.log('Do It')
}
true || doSomething() // doSomething 동작 X
false && doSomething() // doSomething 동작 X

||연산자는 true를 만나면 뒤쪽 표현식은 보지 않고 종료되고 &&연산자는 false를 만나면 뒤 쪽 표현식은 보지 않고 종료됩니다.

옵셔널 체이닝 연산자

좌측의 피연산자가 null혹은 undefined이면 undefined를 반환하고 그게 아니라면 우항의 프로퍼티를 참조하는 것을 말합니다.

var elem = null

elem?.value // undefined
elem = {value : 1}
elem?.value // 1

null 병합 연산자

null ?? 'default string'
null || 'default string'  // 기존에 많이 사용하던 방법

보통 초기값이 null혹은 undefined로 설정되는 것을 막기 위해 사용합니다. 기존에 ||를 사용했을때 0 혹은 '' 또한 초기 값으로 사용 불가능 했지 때문에 ??의 효용성이 더욱 높다고 할 수 있습니다.

profile
안녕하세요 프론트엔드 개발자를 꿈꾸는 엄강우입니다.

0개의 댓글