본문 바로가기
개발서적/모던 자바스크립트 Deep Dive

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

by 사과넹 2024. 4. 15.
반응형

9.1 타입 변환이란?

  • 명시적 타입 변환 / 타입 캐스팅
    • 의도적으로 값의 타입을 변환하는 것
  • 암묵적 타입 변환 / 타입 강제 변환
    • 의도와 상관없이 자바스크립트 엔진에 의해 타입이 변환되는 것
  • 원시 값은 변경 불가능하기 때문에 타입을 변환한다는 것은 기존 원시 값을 이용해 다른 타입의 새로운 원시 값을 생성한 다는 것 → 재할당 아님!

 

9.2 암묵적 타입 변환

  • 자바스크립트는 암묵적 타입 변환을 통해 에러를 내야하는 상황에서 에러를 내지 않게 처리한다.
    • ???

 

9.2.1 문자열 타입으로 변환

  • 값 뒤에 + ‘’ 을 붙이면 문자열로 변환된다…
    • Symbol 타입은 제외
    • 템플릿 리터럴을 사용해 문자열로 변환이 가능하다.

 

9.2.2 숫자 타입으로 변환

  • 값 앞에 + 을 붙이면 숫자 타입으로 변환된다…
    • 숫자 타입으로 변환 불가능할 경우는 결과를 NaN 을 뱉는다.

 

9.2.3 불리언 타입으로 변환

  • 조건식 괄호 안의 값을 Truthy, Falsy로 평가한다.

 

9.4.1 논리 연산자를 사용한 단축 평가

  • 단축 평가 : 타입을 반환하지 않고, 값을 그대로 반환한다는 것
  • A && B
    • A와 B true → B 반환
    • A와 B false → A 반환
'Cat' && 'Dog' // 'Dog'
NaN && null // NaN

 

  • A || B
    • A와 B true → A 반환
    • A와 B false → B 반환
'Cat' || 'Dog' // 'Cat'
NaN || null // null

 

  • 삼항 조건 연산자
    • if - else 문의 단축 표현
let isTrue = true;
message = isTrue ? '완료' : '미완료' // : 기준으로 좌항이 true일때, 우항이 false 일때 반환

 

  • 객체를 가리키기를 기대하는 변수가 null 또는 undefined가 아닌지 확인하고 프로퍼티 참조 시
    • &&을 활용해 해당 객체를 확인 또는 값 할당 가능
    • 객체의 키가 동적일 때도 활용할 수 있다. 키가 없을 수도 있는 경우..
let el = { name: 'jiyeon' };
let name = 'no-data' && el.name; // name = 'jiyeon'
let age = '' && el.age // age = ''

 

  • 함수 매개변수에 기본값을 설정할 때
    • 매개변수의 기본값을 설정해놓으면 함수 호출시 인수가 없어도 에러를 발생시키지 않음
    • 인수가 들어오지 않는 상황을 예외 처리할 수 있겠다 .. 는 생각. 어떻게 하면 잘 활용할 수 있을까?
      • 인수가 옵셔널이 아니고, 필수라면 인수를 넣지 않은 것은 에러를 뱉는게 좀더 맞다고 생각한다.

 

9.4.2 옵셔널 체이닝 연산자 : ES11

  • 위에서 && 연산자 대신해 활용해 객체를 가리키기 기대하는 변수가 null 또는 undefined가 아닌지 확인 확인하고 프로퍼티 참조할 때 유용하게 사용된다.
let el = { name: 'jiyeon' };
let name = el?.name; // name = 'jiyeon'
let age = el?.age // age = undefined

 

9.4.3 null 병합 연산자 : ES11

  • ?? 을 사용
  • 좌항이 false 값일 때, 우항을 반환한다.
    • 단, null과 undifined만 해당
  • 이 또한 이전에는 || 연산자를 사용했었다.
  • 객체 프로퍼티가 옵셔널할 때, 기본값을 반환하는 형태로 사용할 수 있겠다.
728x90
반응형