개인적으로 굉장히 중요하다고 여기는 파트.
나중에 타입스크립트를 배우게 될 때 이 부분의 이해가 잘 박혀있으면 도움 많이 될 듯 싶다.
자바스크립트는 7개의 데이터타입을 가지고 있고 이는 원시타입과 객체 타입으로 나뉜다.
- 원시타입 : number, string, boolean, undefined, null, Symbol
- 객체타입 : 객체, 함수, 배열 등
숫자타입
정수 실수 2진수 8진수 16진수 리터럴은 모두 부동소수점 형식의 2진수로 저장되기 때문에 모든 수를 실수로 정의한다.
그렇기 때문에 정수로 표시되는 수끼리 나누더라도 실수가 나올 수 있다.
console.log(1===1.0) //true또한 숫자 타임에는 Infinity, -Infinity, NaN 값을 표현할 수 있는데
console.log(10/0); // Infinity
console.log(10/-0); // -Infinity
console.log(1*'String')//NaN문자열타입
✔️ 표기방법
var string;
string='ㅁㅁ';
string="ㅁㅁ";
string=`ㅁㅁ`;템플릿 리터럴
ES6부터 도입된 개념. `` 백틱을 사용하여 표현한다. 백틱 안에서 멀티라인 문자열 등 기능을 사용할 수 있다.
✔️ 백틱을 사용한 표현식 삽입
console.log(`my name is ${변수명}`);이런식으로 사용 ㄱㄴ. 이런 방식은 꼭 템플릿 리터럴 내부에서 사용해야 의도대로 동작한다.
Boolean
논리적 참과 거짓을 나타내는 true false가 있음.
Undefined
자바스크립트 엔진의 동작원리에서 한 번 공부한 적 있지만 var 키워드는 선언과 동시에 전역 컨텍스트에서 undefined 로 초기화된다. 가비지 값이 들어있더라도 선언과 동시에 undefiend 로 초기화되기 때문에 할당 없이 변수를 참조해도 undefined 가 반환된다.
이처럼 undefined 는 개발자의 의도가 아니라 자스엔진에 의해 발생되는 값이므로 의도적인 비움 값을 주고 싶다면 null 을 사용하는 것을 권장한다.
null
자바스크립트는 대소문자를 구분하므로 null, Null, NULL 과는 다르다. 의도적인 부재를 위해 할당한다면 'null'로 사용하기!
변수에 null 을 할당한다는 의미는 변수가 이전에 참조하던 것을 더 이상 참조하지 않겠다는 의미임.
✔️ 언제 사용할 수 있을까
함수가 유효한 값을 반환할 수 없는 경우 명시적 null 을 반환하기도 함.
<!DOCTYPR html>
<html>
<body>
<script>
var element = document.querySelector('.myClass');
console.log(element); //null
</script>
</body>
</html>조건에 부합하는 html요소를 검색할 수 없는 경우 null 이 반환된다.
심벌 타입
ES6에서 추가된 타입으로 변경 불가능한 원시 타입의 값이라고 한다. 일단 직관적으로 이해가 잘 안됨..
다른 값과 중복되지 않는 유일무이한 값이기 때문에 객체의 유일한 프로퍼티 키를 만들기 위해 사용된다 - ?
✔️ 심벌 생성방법
다른 값들은 리터럴로 생성하지만 심벌은 함수를 통해 생성함.
var key=Symbol('key');
console.log(typeof key);객체타입
자바스크립트의 대부분은 객체로 이루어져 있다. 앞서 살펴본 6가지 외에는 모두 객체로 이루어져있다. 뒷장에서 좀 더 자세히 살펴보자.
데이터 타입은 대체 왜 필요하지?
- 메모리에 값을 저장하기 위해서는 확보해야 할 메모리의 크기를 알아야한다. 각 데이터마다 정해져 있는 데이터 공간의 크기가 다르기 때문이다.
ex) 숫자 타입의 경우에는 8바이트의 메모리 공간을 확보한다. 그 뒤 2진수로 메모리에 저장한다.
단, ECMAScript 사양은 문자열과 숫자 이외에 데이터 타입 크기를 명시적으로 규정하고 있지는 않다.
-
값을 참조할 때를 생각해보자. 메모리에서 데이터를 읽어올 때 대체 어디부터 어디까지가 숫자 하나라고 볼 수 있을까? 데이터 타입이 정해져 있기 때문에 타입별로 미리 정해진 크기만큼만 읽는 방식으로 데이터를 구분할 수 있는 것이다.
-
모든 데이터는 2진수로 저장된다. 참조하여 읽어올 때 이게 숫자인지 문자열인지 어떻게 구분할까? 이 때 데이터 타입이 필요하다.
2진수 1000001 의 경우 숫자라면 65, 문자라면 A이다. 이를 알맞게 구분하기 위해 데이터 타입이 있어야 하는 것이다.
동적 타이핑과 정적 타이핑
흔히 C,C++,자바,코틀린과 같은 언어를 정적 타입 언어라고 부르고 php, 자바스크립트 등의 언어를 동적 타입 언어라고 부른다.
이러한 개념이 무엇인지 이해해보자.
char c;
string str;
int num;c언어와 같은 정적타입 언어같은 경우에는 변수를 선언할 때 데이터 타입이 결정된다. 컴파일 시 타입체크가 일어나고 이 때 올바른 타입이 들어가지 않았다면 에러를 발생시킨다. 그렇기 때문에 좀 더 강력한 데이터 타입의 규제가 일어나는 것이다!
반면,
var str="aa"; //typeof 로 찍으면 string
var num=5 //number
var sy=Symbol(); //Symbol
...자바스크립트 같은 경우에는 var, let, const 키워드로 변수를 선언할 뿐 데이터 타입을 명시하지 않는다. 즉, 변수에 데이터 값이 할당될 때 타입이 결정 되는 것이다. 이것을 동적 타이핑이라고 한다.
다시 한 번 정리하자면 정적 타입 언어는 변수가 선언될 때 타입이 결정되고 동적 타입 언어는 변수에 데이터가 할당 될 때 타입이 결정된다.
💡 알게된 점
- querySelector의 경우 조건에 부합하는 html요소를 검색할 수 없는 경우 null 이 반환된다.
- 동적 타이핑이라 개념에 대해 따로 찾아보지 않아서 혼란스러웠는데 이해하게 됨.
- 데이터 타입이 필요한 이유를 깊게 생각해보지 않았는데 역시 쓸데 없는 건 없다. 맞네 맞네,, 계속 이럼
