일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- 이터러블
- 데이터 타입
- ES6 함수의 추가 기능
- Strict Mode
- 클로저
- 배열
- 싸피
- 에러 처리
- Escape Hatches
- Ref로 DOM 다루기
- async
- Set과 Map
- 개발 환경 구축
- 코어JS
- 제너레이터
- js
- Ref로 값 참조하기
- 표현식과 문
- rest api
- REACT
- await
- 프로미스
- DEEPDIVE
- BETA
- 비동기 프로그래밍
- 모듈
- 브라우저의 렌더링 과정
- 스프레드 문법
- Deep Dive
- 디스트럭처링 할당
- Today
- Total
코딩을 쉽게 해보자
[Deep Dive] 6장 - 데이터 타입 본문
자바스크립트의 모든 값은 데이터 타입을 갖는다.
자바스크립트(ES6)는 7개의 데이터 타입을 제공한다.
구분 | 데이터 타입 | 설명 |
원시(primitive) 타입 | 숫자(Number) 타입 | 숫자, 정수와 실수 구분 없이 하나의 숫자 타입만 존재 |
문자열(String) 타입 | 문자열 | |
불리언(Boolean) 타입 | 논리적 참(true)과 거짓(false) | |
undefined 타입 | var 키워드로 선언된 변수에 암묵적으로 할당되는 값 | |
null 타입 | 값이 없다는 것을 의도적으로 명시할 때 사용하는 값 | |
심벌(Symbol) 타입 | ES6에서 추가된 7번째 타입 | |
객체(object/reference) 타입 | 객체, 함수, 배열 |
숫자 타입
C나 자바의 경우 intm long, float, double과 같은 다양한 숫자 타입을 제공하지만
자바스크립트는 모든 수를 실수로 처리하며, 정수만 표현하기 위한 데이터 타입이 별도로 존재하지 않는다.
// 숫자 타입은 모두 실수로 처리된다.
console.log(1 === 1.0); // true
숫자 타입은 세 가지 특별한 값도 표현할 수 있다.
- Infinity: 양의 무한대
- -Infinity: 음의 무한대
- NaN: 산술 연산 불가(not-a-number)
문자열 타입
- (''): 작은 따옴표
- (""): 큰 따옴표
- (``): 으로 텍스트를 감싼다.
문자열을 따옴표로 감싸지 않으면 키워드나 삭별자 같은 토큰으로 인식한다.
자바스크립트의 문자열은 원시 타입이며, 변경 불가능한 값이다.
즉, 문자열이 생성되면 그 문자열을 변경할 수 없다는 것을 의미한다.
템플릿 리터럴
ES6부터 템플릿 리터럴이 도입되었다.
런타임에 일반 문자열로 변환되어 처리된다.
백틱(``)을 사용해 표현한다.
var template = `Template Literal`;
console.log(template); // Template Literal
멀티라인 문자열, 표현식 삽입 등에 편리하다.
일반 문자열 내에서 줄바꿈 등의 공백을 표현하려면 백슬래시(\)로 시작하는 이스케이프 시퀀스를 사용해야 하지만,
이스케이프 시퀀스를 사용하지 않고도 줄바꿈이 허용되며 공백도 그대로 적용된다.
$ { }으로 표현식을 템플릿 리터럴 내에 넣어 사용할 수 있다.
불리언 타입
불리언 타입의 값은 true와 false뿐이다.
undefined 타입
var 키워드로 선언한 변수는 암묵적으로 undefined로 초기화된다.
undefined는 개발자가 의도적으로 할당하기 위한 값이 아니라 자바스크립트 엔진이 변수를 초기화할 때 사용하는 값이다.
변수를 참조했을 때 undefined가 반환된다면 참조한 변수가 선언 이후 값이 할당된적이 없는, 즉 초기화되지 않은 변수라는 것을 알 수 있다.
null 타입
변수에 값이 없다는 것을 의도적으로 명시할 때 사용한다.
document.querySelector는 조건에 부합하는 HTML 요소를 검색할 수 없는 경우 null을 반환한다.
심벌 타입
ES6에서 추가된 7번째 타입, 변경 불가능한 원시 타입의 값
Symbol함수를 호출해 생성하고 다른 값과 절대 중복되지 않는 유일무이한 값이다.
// 심벌 값 생성
var key = Symbol('key');
console.log(typeof key); // symbol
객체 타입
위에 언급한 6가지 원시 타입 이외의 값은 모두 객체 타입이다.
자바스크립트는 객체 기반의 언어이며, 자바스크립트를 이루고 있는 거의 모든 것이 객체이다.
데이터 타입의 필요성
- 값을 저장할 때 확보해야하는 메모리 공간의 크기를 결정하기 위해
- 값을 참조할 때 한번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해
- 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해
데이터 타입에 의한 메모리 공간의 확보와 참조
저장 시: 변수에 할당되는 값의 데이터 타입에 따라 확보해야 할 메모리 공간의 크기가 결정된다.
참조 시: 읽는 값의 데이터 타입에 따라 읽어들이는 메모리 공간의 크기가 결정된다.
데이터 타입에 의한 값의 해석
메모리에서 읽어 들인 2진수를 어떻게 해석해야 하는지 문제가 있다.
값 0100 0001을 숫자로 해석하면 65, 문자열로 해석하면 'A'다.
동적 타이핑
동적 타입 언어와 정적 타입 언어
정적 타입 언어는 즉 데이터 타입을 사전에 선언해야 한다.(C, 자바)
컴파일 시점에 타입체크를 수행함으로써 안정적인 코드의 구현을 통해 런타임에 발생하는 에러를 줄일 수 있다.
동적 타입 언어는 사전에 데이터 타입을 선언하지 않는다.
자바스크립트의 변수는 선언이 아닌 할당에 의해 타입이 결정(타입 추론Type Inference)된다.
재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다.
이러한 특징을 동적 타이핑이라한다.
동적 타입 언어와 변수
개발자의 의도와는 상관없이 엔진에 의해 암묵적으로 타입이 자동으로 변환되기도 한다. 결국 동적 타입 언어는 유연성은 높지만 신뢰성은 떨어진다.
주의할 사항
- 변수는 꼭 필요한 경우에 한해만 사용한다.
- 변수의 유효 범위(스코프)는 최대한 좁게 만들어 변수의 부작용을 억제해야 한다.
- 전역 변수는 최대한 사용하지 않도록 한다.
- 변수보다는 상수를 사용해 값의 변경을 억제한다.
- 변수 이름은 변수의 의미를 파악할 수 있도록 네이밍한다.
가독성이 좋은 코드가 좋은 코드다.
'JavaScript' 카테고리의 다른 글
[Deep Dive] 8장 - 제어문 (0) | 2022.08.21 |
---|---|
[Deep Dive] 7장 - 연산자 (0) | 2022.08.19 |
[Deep Dive] 5장 - 표현식과 문 (0) | 2022.08.17 |
[Deep Dive] 4장 - 변수 (0) | 2022.08.16 |
[Deep Dive] 1장~ 3장 (0) | 2022.08.16 |