이 글은 번역 및 정리 글입니다. 출처: javascript.info

원시형의 메소드

자바스크립트를 사용하면 원시형을 객체처럼 사용할 수 있다. 원시형도 메소드를 제공하는데, 원시형은 객체가 아닌데 어떻게 사용할 수 있게되는건지 살펴보자.

우선 원시형과 객체의 주요 차이점부터 살펴보자.

프리미티브

• 기본 유형의 값
• 6개의 기본유형이 있다: string, number, boolean, symbol, null, undefined

객체

• 여러 값을 속성으로 저장할 수 있다.
• 함수처럼 몇가지 종류가 다른 객체가 있다.

객체의 가장 좋은 점 중 하나는 함수를 속성 중 하나로 저장할 수 있다는 것이다.

let john = {
  name: 'John',
  sayHi: function() {
    alert('Hi buddy!');
  }
};

john.sayHi(); // Hi buddy!

그러나 객체는 원시형보다 무겁다.

객체로서의 원시형

자바스크립트 개발자는 하나의 역설을 겪게된다.

• 문자열이나 숫자와 같은 원시형으로 수행하려는 많은 작업이 있다면 메소드로 접근하는것이 좋다.
• 기본요소는 가능한 한 빠르고 가벼워야한다.

해결책은 아래와 같다.

1. 원시형은 원하는 단일 값이다.
2. 특수한 객체래퍼가 생성 된 다음 폐기된다.

예를 들어보자. 대문자를 반환하는 문자열 메소드 str.toUpperCase()가 있다.

작동은 아래처럼 한다.

let str = 'Hello';

alert(str.toUpperCase()); // HELLO

실제로는 어떻게 작동할까?

1. 문자열 str은 원시형이다. 따라서 속성에 액세스하는 순간 문자열의 값을 아는 특수한 객체가 생성된다. 이 특수한 객체는 유용한 메소드들을 가지고있다. toUpperCase() 같은.
2. 이 메소드는 실행되고 새문자열을 반환한다.
3. 특수한 객체는 파괴되고 원시형 str만 남는다.

따라서 원시형은 메소드를 제공할 수 있지만 여전히 가볍다.

자바스크립트 엔진은 이 프로세스를 아주 최적화한다. 여분의 객체 생성을 아예 건너 뛸 수도 있다.

그리고 null과 undefined에는 메소드가 없다. 어떤 의미에서 가장 원시형이라고 할 수 있다.

숙제

문자열 속성을 추가 할 수 있을까?

let str = 'Hello';

str.test = 5;

alert(str.test);

어떨까?

2023년 새해에는 성장하고 함께하고 싶다면?

Pre A 단계 이상의 스타트업 C 레벨들이 모여서 커뮤니티를 만들었습니다. 같이 스터디하고 친해질 일잘러를 찾습니다.