FE/JavaScript

[JavaScript] 객체 래퍼에 대해 알아보기 ( string에 메서드가 있다? 맞는 말일까?)

mandelina 2023. 3. 1. 21:03

자바스크립트에서 객체 이외에도 기본형 7가지 타입이 있다.

(string, number, boolean, null, undefined, symbol, bigint )

 

기본형들은 불변이며 메서드를 가지지 않는다는 점에서 객체와 구별된다.

 

하지만 string을 예로 들어보면 메서드를 가진것 처럼 보인다. 

 

🤷‍♂️ charAt은 string의 메서드가 아닌걸요?
'primitive'.charAt(3)
// => "m"

 

여기서 등장하는 개념이 바로 객체래퍼 이다!

 

 

 

 

객체래퍼란?

- 원시타입의 프로퍼티에 접근하려 할 때 생성되는 임시객체를 뜻한다.

 

 즉 위의 예제를 다시 한번 살펴보면, string은 객체가 아니기 때문에 메서드가 없지만 new String (str)을 호출한 것처럼 문자열 리터럴을 객체로 변환시켜주어 charAt 메서드를 사용할 수 있었던것이다. 

 

charAt메서드를 호출하고 마지막에 래핑했던 객체를 버리게 된다.

 

 

타입스크립트에서 객체래퍼

- TS는 기본형과 객체 래퍼 타입을 별도로 모델링한다.

  • string과 String
  • number와 Number
  • boolean과 Boolean
  • symbol과 Symbol
  • bigint와 BigInt

 

- TS에서 객체 래퍼 타입을 사용하는 경우 문제가 발생할 수 있으므로 지양하고 , 대신 기본형을 사용해야한다.

 

 

 

자바스크립트에서 자주 사용하는 표준객체

- 마지막으로 자주 사용하는 JS의 내장 객체를 소개하겠다.

  • Number
  • Math
  • Date
  • String
  • Array

 

이렇게 어떻게 string,number 등이 객체처럼 메서드를 가지며 동작하는지 알아보았다!