JS Basic #1, 2는 제로초님의 유투브 강의를 듣고 정리했다면 이번 주제는 좀 더 깊게 알고싶어 책 '코어 자바스크립트'와 홈페이지 '모던 자바스크립트 Deep Dive'에 나온 내용들을 정리해보겠습니다.
데이터 타입
데이터 타입에는 크게 두가지로 기본형(원시형: primitive type), 참조형(refernce type)으로 나뉜는데 기본형은 값이 담긴 주솟값을 바로 복제, 참조형은 값이 담긴 주솟값들로 이루어진 묶음을 가르키는 주솟값을 복제한다.
데이터는 변수 영역에 저장되는게 아닌 메모리 영역에 저장되어 있다. 나눠서 저장하는 이유는 데이터 변환을 자유롭게 할 수 있고, 메모리를 더욱 효율적으로 관리할 수 있기 때문인데
만약 나누지 않았다면 미리 확보한 공간에서만 데이터를 변환할 때 마지막 데이터의 변환은 늘리면 되지만 중간 데이터는 변환 때문에 늘어나게 된다면 뒤에 있던 부분을 뒤로 옮기고 이동시킨 주소를 다시 연결해야함으로 컴퓨터가 처리해야할 연산이 많아진다.
그래서 메모리 영역을 따로 나누어 수정할 때마다 메모리 영역에 값을 저장하고 그 주솟값을 변수 영역이 참조한다.
또한 변수명을 통해 데이터의 의미를 명확히 할 수 있어 코드의 가독성이 좋아지는 효과도 있다.
기본형(원시형: primitive type)
- 숫자(number)
- 문자열(string)
- 불리언(boolean)
- null
- undifined
- Symbol <ES6에 추가>
참조형(refernce type)
- 객체(object)
- 배열(array)
- 함수(function)
- 날짜(Date)
- 정규표현식(RegExp)
- Map <ES6에 추가>
- WeakMap <ES6에 추가>
- Set <ES6에 추가>
- WeakSet <ES6에 추가>
변수(variable)
변수는 값의 위치(주소)를 기억하는 저장소이며 var, let, const 키워드를 사용하여 선언하고 할당 연산자=를 사용해 값을 할당한다. 그리고 식별자인 변수명을 사용해 변수에 저장된 값을 참조한다.
변수를 쓰는 이유는 애플리케이션에서 한번 쓰고 버리는 값이 아닌 값이 아닌 일정 기간 유지(캐싱)할 필요가 있는 값에 사용한다.
var score; // 변수의 선언 score = 80; // 값의 할당 score = 90; // 값의 재할당 score; // 변수의 참조 // 변수의 선언과 할당 var average = (50 + 100) / 2;
변수(variable) VS 식별자(identifier)의 차이점
변수와 식별자를 혼용하는 경우가 많은데 변수는 '변할 수 있는 수' 즉 데이터를 뜻하고 식별자는 '데이터를 식별할 때 사용하는 이름' 즉 변수명을 뜻한다.
주의할 점
- 변수 선언할 때
- 한 줄에 선언 한개씩 하기 (무조건 짧게한다고 가독성이 높아지는건 아니기 때문)
- 변수명 규칙 따르기
- 첫 글자는 숫자가 될 수 없다.
- 문자와 숫자, 그리고 기호
$와_만 들어갈 수 있다. - 대/소문자를 구별한다. (A와 a는 다른 문자로 받아들임)
- 예약어(reserved name) 단어들은 변수명으로 사용할 수 없다.
- 뜻을 알 수 없는 줄임말은 지양한다.
- 선언만 되어 있는 변수는
undefined로 초기값을 갖는다. - 선언하지 않은 변수에 접근하면
ReferenceError가 발생한다.var x; console.log(x); // undefined console.log(y); // ReferenceError - 변수 중복 선언
var은 경우 중복 선언이 가능하다. 하지만 동일한 변수명이 선언되어 있는 것을 모르고 변수를 중복 선언했다면 의도치 않게 변수의 값을 변경하는 부작용을 발생시킨다. 따라서 변수의 중복 선언은 문법적으로 허용되지만 사용하지 않는 것이 좋다.var x = 1; console.log(x); // 1 var x = 100; console.log(x); // 100
var 대신 let을 쓰는 이유
var로 선언한 변수는 let으로 선언한 변수와 유사하다. 대부분의 경우에 let을 var로, var를 let으로 바꿔도 큰 문제 없이 동 하지만 var는 초기 자바스크립트 구현 방식 때문에 let과 const로 선언한 변수와는 다른 방식으로 동작한다.
var는 블럭 스코프가 없다.
var로 선언한 변수의 스코프는 함수 스코프이거나 전역 스코프이다. 블록 기준으로 스코프가 생기지 않기 때문에 블록 밖에서 접근 가능합니다. 어느 곳이든 접근할 수 있다는 장점과 분리가 되어야하는 곳에서도 접근하는 단점이 양면성으로 존재한다.var은 선언하기 전에도 사용할 수 있다.
var은 함수가 시작되면 나중에 선언하거나,if(false)문 안에 들어가 있더라도 호이스팅(hoisting <hoist: 끓어올리다.>)이 되어 상관 없게 된다.
하지만 선언만 될 뿐 할당한 값은 나중에 적용된다.function sayHi() { var phrase; // 선언은 함수 시작 시 처리됩니다. alert(phrase); // undefined phrase = "Hello"; // 할당은 실행 흐름이 해당 코드에 도달했을 때 처리됩니다. } sayHi();이것들을 방지하기 위해 ES6에서
let그리고const가 나온 것이다.
ES6가 나오기전 개발자들이 즉시 실행 함수 표현식을 만들어 사용하였는데 링크를 통해서 참고하길 바란다.
상수(constant)
변화하지 않는 변수를 선언할 땐, let 대신 const를 사용한다. 상수는 변수 선언과 동시에 할당을 해야하고, 재할당할 수 없으므로 상수의 값을 변경하려고 할 때는 TypeError가 나오고 변수명만 선언하면 SyntaxError가 발생한다. (변수 선언만 하는 것 조차 안된다.)
상수가 변화하지 않는다고 하여 불변값과 같은 것이 아닌 이유는 상수에 객체를 할당했다면, 할당된 객체의 프로퍼티는 수정, 삭제가 가능하다. 객체는 참조 타입이라 값이 할당된 메모리의 주소를 참조하고 있으므로 가변값을 가지게 된다.
변수 VS 상수, 상수 VS 불변값
변수와 상수를 구분 짓는 변경 가능성의 대상은 변수 영역 메모리이다. 한 번 데이터 할당이 이뤄진 변수 공간에 다른 데이터를 재할당할 수 있는지 여부가 관건이면 반면 불변성 여부를 구분할 때의 변결 가능성의 대상은 데어터 영역 메모리이다.
