1. 타입

타입

자바스크립트에서 타입의 종류를 알아보고, 주의사항을 알아본다. 자바스크립트는 타입리스 랭귀지 중 하나 이지만, 값을 통해 7가지의 타입을 추론할 수 있다. 그에 따른 주의사항 및 정확한 사용법의 익힘이 필요하다.

타입의 종류

총 6가지 였으나 ES6에서 Symbol이 추가되어 7가지

• String

• Number

• Boolean

• Object (객체:{}, 배열:[], 함수:function(){})

• null

• undefined

• Symbol (ES6 추가) // TODO : 나중에 알아보기

  • 변경 불가능한 원시타입의 값

  • 주로 이름의 충돌 위험이 없는 유일한 객체의 프로퍼티 키(property key)를 만들기 위해 사용한다.

주요 개념 및 내용

typeof 연산자를 사용하여 타입체크가 가능함. 타입은 전부 소문자로 (string, number, boolean, object, undefined, symbol) 3개의 원시타입 : string, number, boolean 3개의 그외 : object, undefined, symbol

• String

  • 불변객체

  • 원시타입

• Number

  • 숫자의 범위, 표현

  • 원시타입

• Boolean

  • true 0 이외

  • false 0

  • 4장 강제변환 에서 좀 더 다양하게 다룸 / true false는 숫자로 적용하기에 자스에서는 좁은 범위임

  • 강제변환이나 비교시 주의 할게 많음

  • 원시타입

• null

  • typeof -> object로 나옴

  • 원시값 ? 이지만 object인 특별한 녀석

• undefined

  • 선언 ok, 아직 값 할당 x

  • 독립적인 존재

  • unclared : 변수조차 선언 안된 상태

• object

  • function : object의 일종이지만 체크시 function 으로 나옴

  • 배열 : object의 일종. object로 나옴

주의 사항

• null을 정확히 체크

   let a = null;
   if (!a && typeof a === 'object'){
       //true
   }

• 선언되지 않은 변수 사용시

    // 에러코드
    if(DEBUG){
        // DEBUG는 선언되지 않은 변수 -> 사용하려고 할떄 에러 발생
        // ReferenceError 발생
    }
  
    // 개선코드
    if(typeof DEBUG !== 'undefined'){
        // typeof를 가드용으로 사용
        // DEBUG가 undefined 인지 아닌지 정확히 측정할 필요가 있음
    }

그외 빠트린 부분 정리

호이스팅 개념 잠깐 출현. JS API 재정의 시 typeof 활용

var atob;
if(typeof atob === 'undefined'){
    atob = function(){
        // 재정의
        // 호이스팅
    }   
}

테스트 코드

(function () {
    let a = function () {
    };

    console.log(typeof a);
    console.log(typeof []);
    console.log(typeof {});
    console.log(typeof "");
    console.log(typeof 1);
    console.log(typeof true);
    console.log(typeof null);
    console.log(typeof undefined);

    let b = null;

    if (!b) {
        console.log("true");
    }

    if (b == null) {
        console.log("true");
    }

    if (!b && typeof b === 'object') {
        console.log("true");
    }

    console.log("=============");

    let a2;
    console.log(typeof a2);

    let b2 = 42;
    let c;

    b2 = c;  // b에 undefined 할당

    console.log(typeof b2);  //undefined
    console.log(typeof c);  //undefined
    // console.log(d); // unclared

    // if(DEBUG){
    //     console.log("error");
    // }


})();