자바스크립트 데이터 타입 Data Type

Achievement Goals

✅  자바스크립트에서 원시 자료형과 참조 자료형이 무엇인지 알 수 있다.
✅  원시 자료형 string, number, boolean, undefined의 의미를 이해할 수 있다.
✅  타입마다 다른 속성과 메소드가 있다는 것을 이해할 수 있다.
✅  typeof 를 활용하여 특정 값의 타입을 확인할 수 있다.
✅  비교 시 엄밀한 비교( === 과 !== )의 필요성을 이해할 수 있다.

 

 

📌  자바스크립트 데이터 타입? 왜 필요해?

 

값은 메모리에 저장하고 참조할 수 있어야 한다.

메모리에 값을 저장하려면, 먼저 확보해야 할 메모리 공간의 크기를 결정해야 한다.

자바스크립트 엔진은 데이터 타입, 즉 값의 종류에 따라 정해진 크기의 메모리 공간을 확보한다.

 

즉, 변수에 할당되는 데이터 타입에 따라 확보해야 할 메모리 공간의 크기가 결정된다.

 

◾ 값을 저장할 때 확보해야 하는 메모리 공간의 크기를 결정하기 위해

◾ 값을 참조할 때 한 번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해

◾ 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해

      ex. 메모리에 저장된 값 0100 0001은 숫자로 해석하면 65지만, 문자열로 해석하면 'A'다.

 

 

📌  데이터 타입의 종류

 

자바스크립트(ES6)의 "모든 값은 데이터 타입data type을 갖는다".

7개의 데이터 타입은 원시 타입(primitive type)과 객체 타입(objective/reference type)으로 분류할 수 있다.

 

💡 원시 타입 primitive type

 

📎  숫자 타입number

 

var binary = 0b01000001; // 2진수
var octal = 0o101;       // 8진수
var hex = 0x41;          // 16진수

console.log(binary === octal); //true
console.log(octal === hex);    //true

console.log(1 === 1.0);    // ture -> 자바스크립트니까 가능
console.log(3 / 2);        // 1.5  -> 소수점 (쌉)가능
console.log(1 * 'String'); // NaN(Not-a-number)

 

정수, 실수, 2진수, 8진수, 16진수를 구분하지 않고 모두 실수로 처리한다.

모두 배정밀도 64비트 부동소수점 형식의 2진수로 메모리에 저장된다.

 

 

📎  문자열 타입string

 

var string;
string = '문자열';  // 작은 따옴표
string = "문자열";  // 큰 따옴표
string = `문자열`;  // 백틱(ES6)

 

문자열은 0개 이상의 16비트 유니코드 문자(UTF-16)의 집합이다. 전 세계 대부분의 문자를 표현할 수 있다.

 

 

📎  불리언 타입boolean

 

var foo = true;
console.log(foo);   // true;

foo = false;
console.log(foo);   // false;

 

불리언 타입의 값은 논리적 참, 거짓을 나타내는 true / false 뿐이다.

 

 

📎  undefined 타입undefined

 

var foo;
console.log(foo);   // undefiend

 

undefined 타입의 값은 undefined가 유일하다.

 

 

📎  null 타입null

 

var foo = 'Lee';

foo = null;        // 이전 참조를 제거했다. foo 변수는 더 이상 'Lee'를 참조하지 않는다.

 

null 타입의 값은 null이 유일하다.

 

 

📎  심벌 타입symbol

 

var key = Symbol('key');
console.log(typeof key);  // symbol

// 객체 생성
var obj = {};

// 이름이 충돌할 위험이 없는 유일무이한 값인 심벌을 속성(프로퍼티)의 키로 사용한다.
obj[key] = 'value'        // 객체의 프로퍼티에 값을 할당한다.
console.log(obj[key]);    // value

 

심벌은 ES6에서 추가된 "7번 째 타입" 이다.

심벌 값은 다른 값과 중복되지 않는 유일무이한 값이다.

-->  주로 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용한다.

 

 

 

💡 객체 타입object/reference type

 

❗ 지금까지 살펴본 6가지 데이터 타입 이외의 값은 "모두 객체 타입"이다.

❗ 자바스크립트를 이루고 있는 거의 모든 것이 객체라는 것을 기억해야 한다.

 

 

📌  동적 타이핑?

 

✔  정적타입static/strong type 언어

 

C나 Java같은 정적타입(static/strong type) 언어는 변수를 선언할 때 데이터 타입을 지정해버린다. 고정 ! 고정 !

선언과 타입 지정이 동시에 일어남. 한번 선언하면 못 바꿈.

 

char C;

int num;

 

 

✔  동적타입dynamic/weak type 언어

 

자바스크립트는 동적타입(dynamic/weak type) 언어이다.

자바스크립트 변수는 선언이 아닌, 할당에 의해 타입이 결정된다. (타입 추론 type inference)

그리고, 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다 ! !

선언과 타입 지정이 무관. 재할당에 의해 언제든지 타입이 바뀔 수 있음.

 

var foo;
console.log(typeof foo);  // undefined

foo = 3;
console.log(typeof foo);  // number

foo = 'Hello';
console.log(typeof foo);  // string

foo = true;
console.log(foo);         // true

foo = null;
console.log(typeof foo);  // object

foo = Symbol();
console.log(typeof foo);  // symbol

foo = {};
console.log(typeof foo);  // object

foo = [];
console.log(typeof foo);  // object

foo = function();
console.log(typeof foo);  // function

 

결국, 동적 타입 언어는 유연성flexibility은 높지만, 신뢰성reliability은 떨어진다.

따라서 변수를 사용할 때, 다음 유의사항을 지켜야한다

 

✔ 변수는 꼭 필요한 경우에 한해 제한적으로 사용한다.
    변수의 개수가 많으면 많을수록 오류가 발생할 확률도 높아진다.
    따라서 변수의 무분별한 남발은 금물이다. 필요한 만큼, 최소한만.
✔ 변수의 유효 범위(스코프)는 최대한 좁게 만들어 변수의 부작용을 억제해야한다.
✔ 전역 변수는 최대한 사용하지 않도록 한다.
✔ 변수 이름은 적절한 이름으로 지어야 한다.

 

 

출처

모던 자바스크립트 Deep Dive - 이웅모