Javascript - 타입 변환과 단축 평가

박규정 GyuJeong·2021년 9월 6일
0

javascript

목록 보기
5/8
post-thumbnail

타입 변환

JS의 모든 값은 타입이 있다. 개발자는 그것을 의도대로 변환할 수 있는데 이렇게 의도적으로 변환하는 것을 명시적 타입변환, 타입 캐스팅이라부르고 의도하지 않았는데 타입이 변환된 경우를 암묵적 타입변환, 강제 타입 변환이라고 부른다.
두 변환 모두 변수를 재할당하지는 않는다. 즉, 직접 접근하여 타입을 변환하는 것이 아닌 일시적으로 타입을 변환하고 다시 원래대로 갖다 놓는다. 그래서 변환된 값을 다른 변수에 저장해 놓으면 다음에 사용할 수 있다.

명시적 타입 변환

  • 표준 빌트인 생성자 함수(String(),Number() ...etc)를 new 연산자 없이 호출하는 방법
  • 표준 빌트인 메서드를 사용하는 방법( toString(),parseInt(), !!=>부정연산자 두 번 사용으로 논리형으로 변환하기 )

암묵적 타입 변환

막 그런거 있자나요 문자열이랑 숫자를 더하면 과연 뭐가될까? 이게 JS엔진이 암묵적으로 어떤 타입으로 변환 시켜주는지를 설명해주는 그런 거에요

  • 문자열 + 숫자 => 문자열
  • 문자열 */%-(+외의 나머지 연산자)숫자 =>숫자
  • +문자열 => 숫자 (숫자가 아니라면 NaN)
    단항연산자+는 문자열을 숫자로 변환한다.
  • 불리언타입은 거의 대부분이 있으면 true 없으면 false
    falsy한 값은 false, undefined, null ,0 ,-0, NaN, ''(빈 문자열)
    이렇게 없다로 해석되는 값들이다. 나머지는 다 truthy

단축평가

이게 뭐냐면 말그대로 평가를 생략하는 것이다. 어떻게 생략하냐? 뒤의 피연산자를 평가하지 않아도 결과가 확정되었다고 판단이 되면 그 결과를 그냥 반환한다. 그래서 논리 연산자 && ||의 결과가 불리언 값이 아닌 경우도 있다.

'Cat' && 'Dog' => 'Dog'의 경우 'Cat'은 암묵적 타입 변환에 의해 true이고 두번째 'Dog'에 의해서 그 결과가 결정된다는 사실이 확정되었다. 그래서 평가를 생략하고 두번째 조건식에해당하는 'Dog'을 반환한다.
'Cat' || 'Dog' => 'Cat'의 경우는 둘 중 어떤 것이든 true가 되면 된다는 사실이 확정되었다. 그렇다면 첫번째 조건식이 true인지 아닌지에 결과가 결정되기 때문에 'Cat'을 반환한다. 만일 false || 'Dog'이라면 'Dog'을 반환할 것이다.

그럼 이 기능을 어디에 쓰느냐?

  • 객체의 프로퍼티를 참조할 때 그 객체가 null인 경우 즉, obj.prop -> obj가 null인 경우 TypeError가 나는데 단축평가가 이를 방지한다. obj && obj.prop 이런식으로 사용
  • 함수 매개 변수에 기본값을 정할 때 function(val){val = val || 'default';}이런식으로 사용

옵셔널 체이닝 연산자 (?.)

?. 연산자 좌항의 피연산자가 undefined나 null인 경우 undefined를 반환하고 그게 아니면 우항의 프로퍼티 참조를 이어간다. && 단축평가를 이용한 객체 프로퍼티 참조와 똑같이 실행된다.

null 병합 연산자 (??)

?? 연산자 좌항의 피연산자가 undefined나 null이 아니라면 좌항을 반환하고 맞다면 우항을 반환한다. ||단축평가와 비슷하게 수행된다. falsy한 값 모두가 아닌 undefined와 null만 보고 판단하는 차이점이 있다.
변수에 기본값을 설정할 때 유용하다. let foo = '' ?? 'default string'
좌항에 변수가 들어오는 것이 아니라면 왜 굳이 이것을 사용하는 지 모르겠지만 기본값을 설정하기에는 유용한 것 같다. 아직 에러를 다루는 방법이나 예외처리에 익숙하지 않고 동작만 되면 일단 넘어가는 개발자여서 그런지도 모르겠다ㅠㅠ

profile
제발 제 코드에 훈수해 주세요 - 제제훈

0개의 댓글

관련 채용 정보