[모던 JavaScript 튜토리얼] 20. 원시값의 메서드

본문 바로가기

원시값 vs 객체

JS에는 아래처럼 7가지의 원시값이 존재한다.

• 문자(string)
• 숫자(number)
• bigint
• 불린(boolean)
• 심볼(symbol)
• null
• undefined

객체는 중괄호({ })로 이루어져 있으며, 이 안에 여러 프로퍼티를 담아 저장할 수 있다. 프로퍼티는 원시값, 함수 등 다양한 값을 가질 수 있다.

원시값을 객체처럼 사용하기

코드 작성 중 문자열, 숫자와 같은 원시값을 다루는 작업이 많다. 그러므로, 원시값에 객체의 특성, 즉 프로퍼티로 정의된 메서드를 사용한다면, 더 수월하고 빠르게 작업할 수 있을 것이다.

원시값은 빠르고 가볍다. 미리 정의된 타입의 값만을 저장하면 되기 때문이다. 하지만 객체는 내부 구조(객체 내부에 정의된 여러 프로퍼티들)를 유지하기 위해 추가 자원을 사용하기 때문에 원시값보다 무겁다. 이런 모순을 해결하기 위해 자바스크립트 창립자는 아래와 같은 규칙을 만들었다.

1. 원시값은 원시값 그대로 남겨둬 단일 값 형태를 유지한다.
2. 문자열, 숫자, 불린, 심볼의 메서드와 프로퍼티에 접근할 수 있도록 언어 차원에서 허용한다.
3. 위 2번을 가능케 하도록, 원시값이 메서드나 프로퍼티에 접근하려 하면, 추가 기능을 제공하는 특수한 객체 원시 래퍼 객체(Wrapper Object) 를 만들어 주고 이를 통해 프로퍼티에 접근한다. 이 객체는 사용 후 곧 삭제된다.

아래 예시를 통해 위의 규칙이 적용된 모습을 살펴보자.

let str = "Hello";

console.log(str.toUpperCase()); // HELLO

위 변수 str은 문자열이라는 원시값이 저장된 변수다. 원시값은 객체가 아니기에, 당연히 프로퍼티도 가지고 있지 않다. 따라서, 원래대로라면 속성 접근자 .(dot)을 통해 접근할 수 없다.

하지만, 위 규칙에 따라 “Hello” 라는 문자열 정보를 갖는 래퍼 객체가 하나 생성되고, 이 객체 내부에 접근할 수 있게 되는 것이다. String 래퍼 클래스엔 문자열을 조작하는 유용한 메서드들이 미리 정의되어 있기에, toUpperCase() 와 같은 메서드를 호출할 수 있는 것이다. 사용이 끝난 이후에 래퍼 객체는 삭제되고, 원시값을 내포하는 str 만 남게 된다고 한다.

let n = 1.23456;

console.log(n.toFixed(2)); // 1.23

위 코드는 고정 소수점 표기법으로 표기해 반환하는 toFixed(digits) 메소드를 사용한 예시다. 파라미터로 전달받은 2의 다음 자릿수 3에서 반올림한 값을 리턴하고, 출력한다.

📕참고:
null과 undefined 는 래퍼 객체가 존재하지 않는다.