데이터 타입(이하 타입)은 값의 종류이다.
ES11에서 새로운 원시값인 BigInt가 추가되었다.
BigInt는 숫자 값이 나타내는 최대치인 2^53 - 1 보다 큰 정수를 표현할 수 있는 정수이다.
6.1 숫자 타입
int, long, float, double등과 같이 다양한 숫자 타입을 제공하는 C나 자바와는 달리 자바스크립트는 하나의 숫자타입만 가지며 숫자 타입의 값은 64비트 부동소수점 형식을 따른다.
즉, 모든 수는 실수로 처리하며 별도의 데이터 타입이 없다.
또한 모든 진수는 10진수로 해석된다.
10진수로 해석하기 이전에 모든 값은 저장될 때 2진 바이너리로 저장된다.
// 모든 숫자 타입이다.
var integer = 10; // 정수
var double = 10.12; // 실수
var negative = -20; // 음의 정수
// 자바스크립트는 모든 진수를 10진수로 해석한다.
var binary = 0b01000001; // 2진수
var octal = 0o101; // 8진수
var hex = 0x41; // 16진수
// 모두 같은 수로 해석된다.
console.log(binary); // 65
console.log(octal); // 65
console.log(hex); // 65
console.log(binary === octal); // true
console.log(binary === hex); // true
자바스크립트는 특별한 값을 표현할 수 있다.
Infinity, -Infinity, NaN
// 자바스크립트 숫자 타입의 특별한 값
console.log(10 / 0); // Infinity
console.log(10 / -0); // -Infinity
console.log(10 * 'string') // NaN
NaN은 자기 자신과도 동등하지 않는, 그 무엇과도 동등하지 않는 값을 갖는다.
NaN을 쓸때 대소문자를 구분하지 않으면 식별자로 해설하므로 틀리지 않게 주의하자
6.2 문자열 타입
문자열 타입은 텍스트 데이터를 나타내는 데 사용한다.
자바스크립트에서 문자열을 아래와 같이 선언한다.
// 문자열 타입
var string;
string = '문자열'; // 작은따옴표
string = "문자열"; // 큰따옴표
string = `문자열`; // 백틱(ES6 이후 등장)
string = '작은따옴표로 감싼 문자열 내의 "큰따옴표"는 문자열로 인식된다.'
string = "큰따옴표로 감싼 문자열 내의 '작은따옴표'는 문자열로 인식된다."
여기서 정말 잘 사용하면 좋은 개념은 백틱을 이용해 작성하는 템플릿 리터럴이다.
템플릿 리터럴을 이용하면 줄바꿈과 모든 공백을 편리하게 적용할 수 있다.
var template = `<ul>
<li><a href="#">HOME</li>
</ul>`;
console.log(template);
// <ul>
// <li><a href="#">HOME</li>
// <ul>
또한 템플릿 리터럴을 활용하면 표현식(변수)를 이용해 문자열도 쉽게 만들 수 있다.
${}을 이용해 표현식을 감싸주면 된다.
이때 표현식 평과 결과가 문자열이 아니여도 문자열 타입으로 강제 변환되어 적용된다.
var name = "오주현";
var age = 24;
// 템플릿 리터럴의 표현식 삽입
console.log(`My name is ${name}, and i'm ${age} years old`);
// My name is 오주현, and i'm 24 years old
6.4 불리언 타입
불리언 타입의 값은 논리적 참, 거짓을 나타내는 true와 false 뿐이다.
var foo = true;
var bar = false;
console.log(foo); // true
console.log(bar); // false
6.5 undefined 타입
undefined타입의 값은 undefined 하나이다.
undefined는 자바스크립트 엔진이 변수를 초기화할 때 사용하는 값이므로, 의도적으로 변수에 undefined를 할당하는 것은 본래 취지에 어긋나 혼란을 줄 수있다.
그렇기에 변수에는 null을 할당해 사용해 주자.
6.6 null 타입
null 타입을 갖는 값은 null이 유일하다.
개발자가 변수에 더이상 값이 없다는 것을 의미할 때는 null을 할당해 명시적으로 참조를 하지 않는 다는 것을 의미한다.
즉, null을 할당하는 것은 더이상 변수를 참조하지 않겠다고 명시적으로 나타내는 것이다.
6.7 심벌 타입
심벌은 ES6에서 추가된 7번 째 타입으로, 변경 불가능한 원시 타입의 값이다.
심벌 값은 다른 값과 중복 되지 않는 유일한 값이라 주로 중복 없이 객체의 프로퍼티 키를 만드는데 사용한다.
var key = Symbol('key');
console.log(typeof key); // symbol
// 객체 생성
var obj = {};
// 중복 위험 없이 프로퍼티 키로 사용
obj[key] = 'value';
console.log(obj[key]); // value
6.8 객체 타입
자바스크립트의 타입은 크게 원시 타입과 객체 타입으로 분류한다.
이는 원시 타입과 객체 타입은 근본부터 다르다. 11장에서 다시 알아보자.
6.8.1 데이터 타입의 필요성
데이터 타입에 의한 메모리 공간의 확보와 참조
자바스크립트 엔진은 데이터 타입에 따라 정해진 크기의 메모리 공간을 확보한다.
즉, 변수에 할당되는 값의 데이터 타입에 따라 확보해야 할 메모리 공간의 크기가 결정된다.
값을 참조할 때 읽어 들여야 할 메모리 공간의 크기(메모리 셀의 갯수, 바이트 수)를 알아야 한다.
앞서 자바스크립트의 모든 값은 바이너리로 저장되는데, 이를 어떻게 해석하는지도 결정 해야한다.
정리하자면,
- 값을 저장할 메모리 공간의 크기를 결정하기 위해
- 값을 참조할 때 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해
- 메모리에서 읽은 2진수를 어떻게 해석할지 결정하기 위해
6.8.2 동적 타이핑
자바스크립트는 동적 타입 언어로써 개발자의 의도와 상관없이 자동으로 값의 타입이 정해진다.
그리고 변수에 어떤 데이터 타입의 값이라도 자유롭게 할당할 수 있다.
동적 타입 언어는 유연성이 좋다.
하지만 이 유연성으로 인한 단점도 있다.
변수 값은 변경할 수 있기 때문에 변화하는 변수 값을 추적하기 어렵고, 값을 확인하기 전까지 타입을 확신할 수 없다.
또한, 자바스크립트 엔진에 의해 암묵적으로 타입이 변환되어 에러가 발생할 수 있다.
동적 타입 언어는 유연성은 높지만 신뢰성은 떨어진다.
정리
- 변수는 꼭 필요한 경우에만 사용하자
- 스코프는 최대한 좁게 만들어 변수의 부작용을 억제하자
- 전역 변수는 최대한 사용하지 말자
의도치 않게 값이 변경될 가능성이 높고 다른 코드에 영향을 줄 수 있다. - 변수보다는 상수를 사용해 값 변경을 억제하자
- 변수의 목적과 의미를 파악할 수 있도록 변수명을 지정하자
이 책에서 정말 좋은 구절이 있다.
코드는 오해하지 않도록 작성해야 한다. 오해는 커뮤티케이션을 어렵게 하는 대표적인 원인으로 생산성을 떨어뜨리는 것은 물론 사기까지 저하시킨다. 코드는 동작하는 것만이 존재 목적은 아니다. 코드는 개발자를 위한 문서이기도 하다. 따라서 사람이 이해할 수 있는 코드, 즉 가독성이 좋은 코드가 좋은 코드다.
이건 내가 정말 중요하다고 생각하는 가독성이 왜 중요한지 말해주는 구절이다.
'JavaScript > 모던 자바스크립트 Deep Dive' 카테고리의 다른 글
8.제어문 (0) | 2023.11.04 |
---|---|
7. 연산자 (0) | 2023.11.02 |
5. 표현식과 문 (1) | 2023.10.24 |
4. 변수 (0) | 2023.10.24 |
2. 자바스크립트란? (0) | 2023.10.19 |