변수란? 데이터를 처리하는 과정에서 일단 데이터를 기억해야 하므로 메모리에 주소값 대신 식별자를 통해 지정한 데이터값이 바로 변수이다.
자바스크립트에서 변수는 다음 4가지 요소를 가진다
*선택자 const/let/var
*변수명
*할당 연산자
*값
변수의 생성은 세가지 단계를 가지며, 그 단계들은
1.선언 단계(변수를 변수 개체에 등록한다)
2.초기화 단계(변수를 메모리에 할당하고,Undefined로 초기화한다
3.할당 단계(Undefined로 초기화된 값에 실제 값을 할당한다)
로 나눌 수 있다.
자바스크립트는 코드 평가와 코드 실행 절차를 밟으며 이는 차후에 설명할 선택자의 변수 생성 과정이 영향받는다.
선택자 const, var, let은 이 세가지 단계가 각각 다르게 동작한다.
var 키워드를 기준으로는
1.코드 평가 단계에서 선언과 초기화 동시에 진행
2.코드 실행 단계에서 할당
코드 평가에서 초기화되어있으므로 할당되기 전 참조가 가능하다.(호이스팅)
호이스팅이란 모든 선언문이 해당 scope의 선두로 옮겨진 것처럼 작동하는 것을 의미한다. 호이스팅은 함수에서도, 변수에서도 발생할 수 있다.
var 키워드는 자바스크립트에 초기에 나온 선택자이지만 다음과 같은 단점이 있다.
1.키워드의 생략 가능
2.중복선언 가능
3.변수 호이스팅
그리고 가장 중요한 전역변수화인데, 모든 scope에서 참조 가능하므로 무분별하게 코드가 수정되거나 변경되어 실행 결과를 예측하기 어려워진다.
(scope란? 자바스크립트의 실행에서 변수를 찾아야 할때 실행되는 변수 찾기 규칙으로 함수 전체를 참조하는 전역 scope와 특정 함수 혹은 조건 내에서만 찾는 로컬 scope가 나누어져 있다.)
반대로 const, let 키워드는 변수 할당 단계에서 다음과 같이
코드 평가 단계:변수 선언
코드 실행 단계:초기화 및 할당
으로 진행한다.
코드 평가 시점에서 변수 선언만 이루어지므로 실행 단계에서는 참조가 불가능하다.
const와 let 키워드는 블록레벨 스코프로 참조하기에, 원하지 않는 단계에서의 참조를 줄일 수 있어 코드 실행 결과를 예측하기 쉬워진다.
각각 키워드의 특징은
const
선언 이후 수정이 불가능함
무조건 값을 할당해야 함
let
재할당이 가능함
값을 할당하지 않아도 생성됨
데이터를 처리할 때 데이터의 종류를 지정하여 알려주어야 하며 이를 형식화한 것이 바로 자료형(데이터 타입)이다.
프로그래밍 언어별로 데이터 타입이 조금씩 달라지며 이는 해당 언어의 특징혹은 목적과도 연관이 있다.
자바스크립트의 자료형은 크게 원시 타입, 객체 타입으로 나뉘며 이 두가지 타입 내에 여러 종류의 분류가 존재한다.
원시 타입은 변경 불가능한 값이며 참조가 아닌 값으로서 전달된다.
자바스크립트에는 원시 레퍼 객체가 따로 존재하며 원시 타입의 값을 상속받아 다른 변수나 함수에서 참조하는 형식으로 데이터를 전달할 수 있다.
객체 타입은 원시타입을 제외한 모든 변수들이 객체 타입이며 이들은 참조의 방식으로 데이터를 전달한다. 참조의 방식으로는 deep copy와 shallow copy가 있으며 두 방식은 차이점이 있다. 또한 객체 타입들은 원시 타입과 달리 값을 변경 가능하다.
원시 타입 상세설명
Number Type
다른 언어들과 달리 자바스크립트는 Number type이라는 하나의 숫자 타입만이 존재하며 모든 Number type은 실수로만 처리된다.
자바스크립트는 배정밀도 64비트 부동소수점(IE7554)형식
* IEEE7554:전자기술사 협회의 부동소수점 표현방식 표준
* 실수를 연산할 때는 근사값으로 처리(0.1+0.2=/0.3)
2^53-1에서 -(2^53-1)까지 다룰 수 있음
원시 래퍼개게에서 상수변수로 제공
넘버 타입 내에서 Infinty(무한),NaN(수가 아님)등 예외 표현도 존재한다.
BigInt Type
임의 정밀도로 정수값을 나타낼수 있는 자바스크립트의 숫자 원시값으로
넘버 타입의 최대값을 넘는 값도 안전하게 계산할 수 있다. 다만 BigInt값은 다른 타입과는 연산할 수 없다.
String Type
텍스트 데이터를 나타낼 때 사용한다.
UTF-16 코드 단위의 시퀸스로 나타낸다.(UTF-16은 유니코드 문자 인코딩 방식)
원시값은 불변이므로 문자 또한 불변
문자값은 쌍따옴표나 따옴표,백틱으로 문자열임을 표현
Boolean Type
논리적 데이터 유형
참/거짓으로 표기되는 타입(1,0 이라고도 표현)
Undefined Type
변수 선언 이후 개발자가 값을 넣지 않았을 경우 표현되는 타입
초기화단계의 값을 불러온 경우 undefined Type일 수 있으며
의도적으로 Undefined Type으로 만들 수 있다.
Null Type
값이 없음을 강조할때 Null Type을 쓰며 의도적으로 참조하지 않을때 사용되곤 한다.
(Null 타입체크를 할때는 === 일치연산자를 사용해야 한다. == 연산자는 값만을 비교하므로 Null 타입과 다른 타입간의 비교는 무조건 False가 된다.)
Symbol Type
ES6에서 추가된 타입으로, 중복되지 않는 유니크한 값으로 객체의 Key값으로 사용할 수 있다. Symbol 함수를 호출하여 사용 가능하다.
객체 타입(Object Type, Reference Type)
다양한 타입의 값을 하나의 단위로 구성한 복합 자료구조
원시 타입을 제외한 모든 자바스크립트의 값은 객체 타입이다.
자바스크립트의 객체 타입은 여러 형태로 존재하며 그 예시로는
@일반 객체와 함수
@날짜
@인덱스 컬렉션
@키 컬렉션
@etc...
등이 있다.
동적 타입 언어란?자바스크립트와 같은 동적 타입 언어는 한번 선언된 변수의 타입을 변경하거나 동작의 결과로 타입이 변경될 수도 있다.
값.toString():문자열 타입으로 전환
Number(값):숫자타입으로 전환
Boolean(값):불리언타입으로 전환
값 +"":문자열로 전환
값 * 1:숫자타입으로 전환
!!값:불리언 타입으로 전환
값이 전환될 때 참조된 타입이 개발자의 의도와 다르게 암묵적 변화가 일어날 경우 타입추론이 어려워 불필요한 디버깅이 필요할 수 있다. 따라서 전달되는 시점에 Typeof 연산이나 일치연산자(===)를 사용하거나 TypeScript처럼 정적으로 타입을 지정해주는 툴을 사용하는 것이 필요하다.