멋쟁이사자처럼 프론트엔드 스쿨 2기 22_Day

aydennote·2022년 4월 28일
0
post-thumbnail

📖 오늘 학습 뽀인트!

  1. JavaScript 자료형
    1-1 원시자료형과 객체자료형
    1-2 Number
    1-3 Boolean
    1-4 Object

1. JavaScript 자료형

🕵️‍♀️JavaScript 자료형?
변수의 자료형은 다양한 데이터를 용도에 맞게 쓰기 위해 필요한 개념이다. 보통 언어에서는 변수의 자료형과 함께 변수를 선언하지만(int, float, string ...) 자바스크립트는 자료형을 함께 쓸 필요는 없다. 매우 편할 것 같지만, 이 때문에 오류가 나는 경우가 있고 이러한 오류는 TypeScript를 사용하는 이유 중 하나가 된다.

1-1 원시자료형과 객체자료형

🕵️‍♀️원시자료형이 뭐지?
원시 타입의 데이터(primitive data types)는 객체가 아닌 하나의 변수에는 하나의 데이터만 담을 수 있는 자료형이다.
string, number, bigint, boolean, undefined, symbol, (null) 이 있다.


🕵️‍♀️객체자료형이 뭐지?
원시 타입을 제외한 모든 타입의 자료형이다. 하나의 변수에 여러 데이터를 담을 수 있는 자료형이다. 여러 데이터를 담을 수 있기 때문에 데이터에 따라 크기가 동적으로 변한다.

1-2 Number

typeof 100             // Number
typeof NaN             // Number
let a=10;              // Number
Number.isNaN(a)        // false

let a=10; 처럼 선언하고 값을 넣었다면, a 변수는 숫자 자료형 변수인 것이다. Number.isNaN으로도 숫자형인지 확인해 볼 수 있다. 숫자라면 false, 숫자가 아니라면 true를 반환한다.

1-3 boolean

typeof true 
typeof false
let b = 0
!!b              //false

boolean 은 참과 거짓을 구분하는 데이터 타입으로 true 와 false 데이터 밖에 없다. !!를 사용해 boolean으로 강제 형변환하여 타입을 확인할 수 있다.

1-4 object

typeof null            // Object
typeof []              // Object
typeof function        // function

개발자가 실수를 인정한 null은 object 타입이다.
자바스크립트의 배열은 일반적인 배열의 동작을 흉내낸 인덱스를 key로 갖고, length 프로퍼티를 갖는 객체다.
typeof function의 반환 결과는 function이다. 하지만 함수형은 따로 없고 object에 포함된다.


✍확실한 자료형 확인 방법

Object.prototype.toString.call(데이터).slice(8, -1);

데이터 안에 변수나 값을 넣으면 실제 자료형을 반환해준다.
위 프로퍼티를 사용하면 배열의 경우 object가 아닌, Array로 반환된다.

profile
기록하는 개발자 Ayden 입니다.

0개의 댓글