Growth from the root - Vanilla JavaScript - 원시값의 메서드

이형준·2023년 4월 11일
0
post-thumbnail

원시값의 메서드

📃 원시값을 마치 객체처럼 다룰 수 있게 해줌, 원시값에서도 메서드를 호출 할 수 있음, 원시값은 객체가 아님.

원시값

  • 원시형 값임.
  • 종류 : 문자, 숫자, bigint, 불린, 심볼, null, undefiend

객체

  • 프로퍼티의 다양한 값을 저장할 수 있음.
  • {} 대괄호를 사용해 만들 수 있음, 함수도 객체의 종류임

(ex)

let john = {
 name : "Jhon",
 sayHi : function(){
   alert("반가워")
 }
};

jhon.sayHi() // 반가워

✏️ 객체 john을 만들고, 거기에 메서드 sayHi를 정의함.



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

🎯 모순 : 문자열, 숫자열 같은 원시값을 다루어야 하는 작업이 많은데, 메서드를 사용하면 작업을 수월하게 할 수 있게하고 싶음
vs 그런데 원시값은 빠르고 가벼워야 함.

✅ 해결방안
1. 원시값은 그대로 남겨둬 단일 값 형태를 유지함
2. 문자열, 숫자, 불린, 심볼의 메서드와 프로퍼티에 접근할 수 있도록 허용
3. 이를 가능하게 하기 위해, 원시값이 메서드나 프로퍼티에 접근하려 하면 추가 기능을 제공해주는 특수한 객체,
"원시 래퍼 객체(object wrapper)"를 만들어 줍니다. 이 객체는 곧 삭제됩니다.

  • 래퍼객체 : 타입에 따라 종류가 다양함, 원시 자료형의 이름을 그대로 사용해서 부름

(ex)

let str = "Hello";

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

✏️ 인수로 받은 문자열의 모든 글자를 대문자로 바꿔주는 "str.toUpperCase()"가 호출될 때 실제로 일어나는 일.

  1. 문자열 str은 원시값이므로 원시값으 프로터티에 접근하는 순간 특별한 객체가 만들어짐
  2. 메서드가 실행되고, 새로운 문자열이 반환됨.
  3. 특별한 객체는 파괴되고, 원시값 str만 남음.

(ex)

let n = 1.23456;

alert(n.toFixed(2)); // 1.23

✏️ 숫자형 고유한 메서드도 지원함, 메서드 toFixed(n)를 이용하면 원하는 자리에서 소수점 아래 숫자를 반올림 함.

profile
프론트엔드 개발자 이형준입니다.

0개의 댓글