728x90
자바스크립트(ES6)는 7개의 타입 제공
- 원시 타입 / 객체 타입으로 분류
- 원시 타입 : 숫자, 문자열, 불리언, undefined, null,심벌 타입
- 객체 타입 : 객체, 함수, 배열 등
1. 숫자 타입
// 숫자 타입은 모두 실수로 처리
console.log(1 === 1.0); // true
console.log(4 / 2); // 2
console.log(3 / 2)'; // 1.5
- 자바스크립트는 하나의 숫자 타입만 존재
- 모든 수를 실수로 처리. 정수만 표현하기 위한 데이터 타입 존재 X
- 숫자 타입의 세 가지 특별한 값
- Infinity : 양의 무한대
- -Infinity : 음의 무한대
- NaN : 산술 연산 불가 (not-a-number)
2. 문자열 타입
- 텍스트 데이터 나타내는 데 사용. 0개 이상의 16비트 유니코드 문자(UTF-16)의 집합
- 식별자와 구분하기 위해 '', "" , 또는 `` (백틱)으로 텍스트를 감쌈. 보통 작은 따옴표 사용
- 자바스크립트의 문자열은 원시 타입으로 변경 불가능한 값
// 따옴표로 감싸지 않았기에 hello를 식별자로 인식
var string = hello; // ReferenceError : hello is not defined
3. 템플릿 리터럴
- ES6 부터 도입. 새로운 문자열 표기법.
- 편리한 문자열 처리 기능 제공
- 런타임에 일반 문자열로 변환되어 처리 됨
- 멀티라인 문자열
- 일반적인 문자열 내 줄바꿈 허용되지 않음. 이스케이프 시퀀스(escape sequence) 사용
- \n : 개행 , \t : 탭(수평), ' : 작은 따옴표 등
- 템플릿 리터럴 사용 시 이스케이프 시퀀스 사용 없이 줄바꿈 가능
// 이스케이프 시퀀스 사용하여 줄바꿈
var template = '<ul>\n\t<li><a href="#">Home</a></li>\n</ul>';
console.log(template);
// 템플릿 리터럴 `` 사용
var template = `<ul>
<li><a href="#">Home</a></li>
</ul>`;
console.log(template);
- 표현식 삽입
- + 사용해 문자열 연결 가능. 피연산자 중 하나 이상이 문자열일 경우 연결 연산자로 동작
// ES5 : 문자열 연결
var first = 'Ung-mo';
var last = 'Lee';
conosole.log('My name is ' + first + ' ' + last + '.'); // My name is Ung-mo Lee.
// ES6 : 표현식 삽입 (꼭 템플릿 리터럴(``,백틱) 안에서만 사용)
var first = 'Ung-mo ';
var last = 'Lee';
console.log(`My name is ${first} ${last}.`); // My name is Ung-mo Lee.
4. 불리언 타입
- 논리적 참, 거짓 true, false
5. undefined 타입
- undefined 타입의 값은 undefined가 유일
- var 키워드로 선언한 변수는 undefined로 초기화 됨
- 자바스크립트 엔진이 변수를 초기화 하는데 사용. 의도적으로 변수에 할당하지 말 것. 대신 null 사용
- 변수를 선언한 후 값을 할당하지 않은 변수를 참조 시 반환 됨
6. null 타입
- null 타입의 값은 null 유일
- 변수에 값이 없음을 의도적으로 명시할 때 사용
- 변수가 이전에 참조한 값을 더 이상 참조하지 않음을 의미
- 함수가 유효한 값을 반환할 수 없는 경우 반환 됨
7. 심벌 타입
- ES6에서 추가된 7번째 타입. 변경불가능한 원시 타입의 값
- 다른 값과 중복되지 않는 유일무이한 값
- 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용
// 심벌 값 생성
var key = Symbol('key');
console.log(typeof key); // symbol
// 객체 생성
var obj = {};
// 이름이 충돌할 위험이 없는 유일무이한 값인 심벌을 프로퍼티 키로 사용
obj[key] = 'value';
console.log(obj[key]); // value
8. 객체 타입
- 객체 : 자바스크립트를 이루고 있는 거의 모든 것
9. 데이터 타입의 필요성
- 값을 저장할 때 (엔진이) 확보해야하는 메모리 공간의 크기를 결정하기 위해
- 값을 참조할 때 (엔진이) 한 번에 읽어들여야 할 메모리 공간의 크기를 결정하기 위해
- 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해
8. 동적 타이핑
- 정적 타입 언어 : 변수를 선언할 때 변수에 할당할 수 있는 값의 종류, 데이터 타입 사전에 선언(명시적 타입 선언)
- ex) C, 자바
- 타입의 일관성을 강제, 안정적인 코드 구현으로 런타임에 발생할 에러 줄임
- 동적 타입 언어 : 선언이 아닌 할당에 의해 변수의 타입이 결정 됨, 재할당으로 변수 타입 동적 변경
- ex) 파이썬, PHP, 루비, 리스프, 펄 등
- 장점 : 유연성 뛰어남, 편리
- 단점 : 변화하는 변수 값 추적 어려움, 값을 확인하기 전에는 타입 확신 불가. 신뢰성 떨어짐
- 변수 생성 시 주의 사항
- 꼭 필요한 경우에 한해 제한적으로 사용. 최소한으로 유지
- 변수의 유효 범위(스코프)는 최대한 좁게 만들 것.
- 전역 변수 최대한 사용하지 않기. 프로그램 복잡성 증가, 처리 흐름 추적 어려움
- 상수를 사용해 값의 변경 억제
- 목적이나 의미를 파악할 수 있도록 네이밍, 식별자(변수, 함수, 클래스 이름) 또한 파악할 수 있게 짓기
- 가독성이 좋은 코드가 좋은 코드!!!
참고 : 모던 자바스크립트 Deep Dive
728x90
'TIL > JavaScript' 카테고리의 다른 글
[딥다이브] 7장 연산자 (0) | 2022.04.21 |
---|---|
프론트엔드 웹개발 환경 셋팅 (0) | 2022.04.21 |
[딥다이브] 5장 표현식과 문 (0) | 2022.04.20 |
[딥다이브] 4장 변수 (0) | 2022.04.20 |
[딥다이브] 3장 자바스크립트 개발 환경과 실행 방법 (0) | 2022.04.17 |