Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Archives
Today
Total
관리 메뉴

도도의 IT이야기

Object.prototype.toString() 메서드 본문

IT/자바스크립트

Object.prototype.toString() 메서드

도도버드 2020. 5. 7. 16:33

다른 부분들을 공부하다보니

객체에 toStirng()이라는 메서드를 많이 사용하더라고요

 

number이나 다른 data type에 .toString() 메서드를 사용하면 그저 string으로 반환된 값을 주는 역활을 하지만 객체 사용하면 약간 다르더라고요.

 

짧게 Object.prototype.toString()대해서 알아보겠습니다.

 

우선 Object.prototype이라고 쓰여있으니 toString()은 빌트인 constructor 함수인 function Object()로 생성된 모든 객체에 상속되고 있다는 것을 알 수 있습니다.

 

그럼 이게 도데체 무엇을 하걸까요?

 

toString() 메서드는 객체를 문자열 같은 방식으로 사용하고 싶을때 사용합니다.

 

예를 들어봅시다.

let girl = {
   name:'Lisa',
   age:20,
   feeling:'good'
};

console.log(girl.toString());//[object Object]

girl.toString=function(){
   return 'hi I am ' + this.name +' '+ this.age + 'years old.'; 
};

console.log(girl.toString());//hi I am Lisa 20years old

 

 우선 girl이라는 object를 만들었습니다. function Object()를 통해서 말이죠. 그래서 girl은 function Object()의 prototype안에 있는 toString()이라는 메서드를 상속 받았습니다.

 

그래서 일단 상속되있는 girl.toString()의 값이 뭔지 확인해보니 [object Object]라고 나옵니다 여기서 Object는 object의 type입니다.

 

[object Object]가 아닌 우리가 지정한 문자열이 나오게 하기 위해선 toString 메서드의 값을 girl object 안에서 reinitailize 해줘야 합니다. 그렇게 reinitialize 한뒤, girl.toString()을 확인해보니 우리가 원하는 문자열이 나왔습니다.

 

다른예제

function Human(name,gender){
   this.name=name,
   this.gender=gender
}

let human1 = new Human('mike','male');
let human2 = new Human('lisa','female');

Human.prototype.toString=function(){
   return "I'm "+this.name+' '+this.gender;
}

human1.toString();//I'm mike male.
human2.toString();//I'm lisa female

 

 

이렇게 여러 종류의 object들의 toString 메서드를 reinitialize하고싶다면 그들의 constructor의 prototype에 toString()을 다른 값으로 덮어씌우면된다.

 

이제 toString()을 직접 호출하지 않고 객체를 문자열 방식으로 사용해서 toString()의 리턴값을 나오게하자

 

function Human(name,gender){
   this.name=name,
   this.gender=gender
}

let human1 = new Human('mike','male');
let human2 = new Human('lisa','female');

Human.prototype.toString=function(){
   return "I'm "+this.name+' '+this.gender;
}

console.log(""+human1)//I'm mike male