자바스크립트 원시 타입 undefined와 null, symbol

저번 포스팅에는 자바스크립트의 원시 타입인 숫자와 문자 그리고 불린에 대해서 배웠습니다. 오늘은 undefined와 null 그리고 es6를 통해 새롭게 추가된 심볼을 배워보도록 하겠습니다. 복습을 원하시면 아래 링크를 클릭해주세요.

자바스크립트의 데이터 타입 - 원시타입 포스팅 보기

null과 undefined

null 타입에서는 null이라는 값만 가지고 있고, undefined 타입에서는 undefined라는 값만 가지고 있습니다. 왜 이런 타입이 있는지 먼저 생각해보셔야 합니다. 변수라는 공간에 무언인가 담을 때 항상 바로 값이 존재하지는 않을 것입니다. 일단은 변수를 선언하고 나중에 값을 담는 일도 있고, 아예 값이 존재하지 않는 다는 것을 명시해야할 상황도 있을 것입니다. 그런 상황들에서 사용하는 것이 null과 undefined입니다. 소스코드를 보면서 자세히 알아보도록 하겠습니다. 

let container;
let container = "shipment";

변수에 대해서 배울 때 이런식으로 선언부터 하고 그 후에 다른 값을 대입했었던 것을 기억하시나요? 사실 따로 값을 안 주고 선언만 했을 때는 undefined라는 값을 가지게 됩니다. 아직 값이 정해지지 않은 상태라고 할 수 있습니다. 그리고 null 또한 값이 정해지지 않았거나 값이 없다는 것을 명시할 때 사용합니다. 

let hello = undefined;
let world = null;

둘 다 이렇게 값을 넣을 수 있고 비슷한 상황에서 쓰이는 것처럼 보이지만 null을 쓰는 것이 더 좋습니다.

변수의 값을 아직모르거나 적용할 수 없는 경우에 대부분 null이 더 좋습니다.

es6에서 새로 추가된 심볼

const s = Symbol("this is example");
const y = Symbol("this is example");

심볼은 이런 형태로 만들어 집니다. s와 y의 변수엔 각각 다른 심볼들이 들어 있습니다. 심볼은 위의 소스코드처럼 선언할 때 마다 다른 심볼들을 만들어 냅니다. 괄호 안에 적힌 것은 그저 심볼에 대한 설명일 뿐 중복되거나 해도 상관없습니다. 하지만 각기 다른 심볼을 만들어내는 특성 때문에 고유한 식별자를 만들어낼 수 있기 때문에 그 식별자에 대한 설명이 들어가는게 제일 좋습니다. 또 심볼은 아직 배우지 않았지만 객체의 키에 들어갈 수 있습니다. 키는 쉽게 설명한다면 이름입니다. 키에 심볼이 들어가면 "비공개"기능이 있어서 보통 접근하던 방식보다 좀 더 어렵게 만들어 줍니다.

원시 타입의 특징을 기억해주세요.

원시 타입 6개를 알아보았습니다. 포스팅을 마무리하며 저번 포스팅에서 말했던 것을 한번 더 언급해보겠습니다. 원시타입의 특징은 불변성을 가지고 복사/전달 시에 값 자체를 복사/전달 한다고 했죠? 불변성에 대해선 저번 포스팅에서 다루었고, 수업을 마무리하며 복사/전달할 때 값 자체를 복사/전달 한다는게 무엇인지 알아보겠습니다.

let a = 3;
let b = a;
a = 2;

변수 a에 3이라는 값을 주고, b는 a의 값을 주었습니다. 그리고 a의 값을 2로 변경했습니다. 그럼 b의 값은 이제 뭐가 될까요? 값 자체를복사/전달한다고 했죠? b의 값은 3입니다. a라는 변수에 담긴 값을 전달 했기 때문이죠.

원시타입의 경우 원본(a)의 값이 바뀌더라고 사본(b)의 값이 따라서 바뀌지 않습니다.

그렇다면 다음 포스팅에 배울 객체(참조 타입)는 결과가 또 달라지겠죠? 한번 어떤 결과가 나올 지 예상해보세요.

공감은 제작자에게 큰 힘이 됩니다.