[🍭JS기초] 원시값[primitive type]의 메서드 (자료구조와 자료형)

자바스크립트는 원시값(문자열, 숫자 등)을 마치 객체처럼 다룰 수 있게 해줌. 

원시값에도 객체처럼 메서드를 호출할 수 있다는 거임. 다만 객체처럼 사용하는 거지 객체는 아닌거임!!

 

 

원시값과 객체의 차이점

 

 

🔹원시값( primitive type)

 

- 원시형 값이다.

- 종류 (문자string, 숫자number, *bigint, 불린boolearn, 심볼symbol, null, undefined) 총 7가지 

 

🔹객체

 

- 프로퍼티에 다양한 종류의 값을 저장할 수 있음 → 장점 중 하나 

- {  } 대괄호를 사용해 만들 수 있음! 자바스크립트에는 여러 종류의 객체가 있는데 함수도 객체의 일종.

 

자바스크립트는 날짜, 오류, HTML요소(HTMLelement) 등을 다룰 수 있게 해주는 다양한 내장 객체를 제공. 이 객체들은 고유한 프로퍼티와 메서드를 가진다. 다만, 이런 기능을 사용하면 시스템 자원이 많이 소모된다는 단점이 있음.

 → 객체는 원시값보다 "무겁고" 내부 구조를 유지하기 위해 "추가 자원"을 사용하기 때문입니다.

 

 

 

래퍼 객체 두두등장

객체를 사용하면 무겁고,, 원시값을 다루어야 하는 작업이 많아서 메서드를 사용하면 작업을 더 편하게 할 수 있을 것 같은데 원시값은 가능한 빠르고 가벼워야 함. 그래서 JS 창안자는 " 래퍼객체 "를 두드등장. 

 

 

 

<방안>

1. 원시값은 원시값 그대로 단일 값 형태를 유지

2. 문자열, 숫자, 불린, 심볼의 메서드와 프로퍼티에 접근할 수 있도록 언어 차원에서 허용.

3. 이를 가능하게 하기 위해, 원시값이 메서드나 프로퍼티에 접근하려하면 추가 기능을 제공해주는 특수한 객체, " 원시 래퍼 객체(object wrapper) " 를 만들어 줌. 이 객체는 곧 삭제 됨. 

 

래퍼 객체는 원시 타입에 따라 종류가 다양합니다. 원시 자료형의 이름을 그대로 사용해서 각각 String, Number, Boolean, Symbol 라고 부르고 각 객체마다 제공하는 메서드 역시 다릅니다.

 

> 예시01

 

> 프로세스

1. 문자열 str은 원시값(String)이어서 원시값의 프로퍼티(toUpperCase)에 접근하는 순간 특별한 객체가

    만들어짐. 

    이 객체는 문자열의 값을 알고 있고, toUpperCase()와 같은 유용한 메서드를 가지고 있음

2. 메서드가 실행되고 새로운 문자열이 반환됨(alert으로 대문자로 바뀐 HELLO PEOPLE 출력)

3. 특별한 객체는 파괴되고, 원시값 str만 남음. ( "alert"수행 시에 이미 래퍼객체는 바로 삭제 되어있음 )

 

이런 내부 프로세스를 통해서 원시값을 가볍게 유지하면서 메서드를 호출할 수 있는 것임. 

 

 

 

 

📍자바스크립트 엔진은 위 프로세스의 최적화에 많은 신경을 씀.

     원시 래퍼 객체를 만들지 않고도 마치 원시 래퍼 객체를 생성(명세에 언급됨) 한 것처럼 동작하게끔 해줌. 

 

📍String/Number/Boolean을 생성자로 사용하지 마셈.

     JAVA 등의 몇 언어에서는 new Number(1)과 같은 문법을 사용해 원하는 타입의 래퍼 객체를 직접 만들 수 있음. 

      JS에서도 하위 호환성을 위해 기능이 있기는 한데 몇 상황에서 혼동을 불러일으킬 수 있기 때문에 사용 비추천!

     ** new를 붙이지 않고 String / Number / Boolean을 사용하는 건 OK. ( 인수를 원하는 형의 원시값으로 바꿔줌 )

 

📍null/undefined는 메서드가 없음. 

     특수 자료형인 null / undefined 이 원시값은 위와 같은 법칙을 따르지 않음. ( 래퍼객체, 메서드 제공 X )

     **  alert(null.test); // error 발생. 

 

 

🍀참고 사이트 : 모던 자바스크립트 튜토리얼 : 원시값의 메서드