23. Object 메소드

안녕하세요. 박기린입니다.

저번 object(객체) 소개글에 이어서, 이번엔 object에 내장된 기본 method(메소드)들에 대해 알아보겠습니다.

---

 

 

 

Method

const giraffe = {
    firstName: 'giraffe',
    lastName: 'park',
    birthYear: 2000,
    job: 'teacher',
    friends: ['Michael', 'Peter'],
    hasDriverLicense: true,

    calcAge: function(birthYear) { // <- 메소드
        return 2022 - birthYear;
    }
};

console.log(giraffe.calcAge(2000)); // 22
console.log(giraffe['calcAge'](2000)); // 22

object는 함수를 property로 가질 수 있습니다. 그리고 이 function property를 method(메소드)라고 말합니다.

 

! - 메소드를 선언할 때는 화살표 함수를 사용하지 맙시다. (관련 설명글)

 

---

 

 

 

this 키워드

const giraffe = {
    firstName: 'giraffe',
    lastName: 'park',
    birthYear: 2000,
    job: 'teacher',
    friends: ['Michael', 'Peter'],
    hasDriverLicense: true,

    calcAge: function() {
        console.log(this); // <- this 키워드 - giraffe object를 return
        return 2022 - this.birthYear; // 2022 - giraffe.birthYear 도 동일한 값을 return
    }
};

console.log(giraffe.calcAge()) // 22

객체의 메소드가 같은 객체 안에 있는 property에 접근하려고 할 때는 'this'키워드를 사용합니다.

this 키워드는 해당 object 전체를 의미합니다.

this 키워드를 사용하는 이유는, 해당 object의 이름이 바뀔 경우에도 일일이 수정할 필요가 없게 해줍니다.

(사실 this 키워드 대신에 obejct의 이름 그대로 사용해도 정상적으로 메소드가 작동은 합니다. 하지만 하지 맙시다.)

---

 

 

 

 

 

 

 

메소드를 이용해서 property를 수정하기

const giraffe = {
  firstName: 'giraffe',
  lastName: 'park',
  birthYear: 2000,
  job: 'teacher',
  friends: ['Michael', 'Peter'],
  hasDriverLicense: false,
  gender: 'male',

  calcAge: function() {
      this.age = 2022 - this.birthYear;
      return this.age;
  },
  
  // Challenge
  // "giraffe is a 22-year old teacher, and he has a/no driver's license"
  getSummary: function() {
      return `${this.firstName} is a ${this.age}-year old ${this.job}, and ${this.gender === 'male' ? 'he' : 'she'} has ${giraffe.hasDriverLicense === true ? 'a' : 'no'} driver's license`;
  }
};

console.log(giraffe.age);
console.log(giraffe.getSummary());

위처럼 객체의 메소드와 this 키워드를 이용해서 기존 property를 바꾸거나 새로 생성할 수 있습니다.

 

---

 

 

 

 

Array - object에서 파생된 형태

Array(배열)도 메소드가 있음을 이전 글에서 확인하였습니다.

배열에는 push, shift, pop, unshift 이름을 가진 메소드가 있었고, 이 외에도 여러 메소드를 가지고 있습니다.

그리고 이 메소드들을 통해서 배열 안에 있는 요소들을 수정, 변경할 수 있습니다. 이를 통해 Array(배열) 또한 object(객체)의 일종임을 알 수 있습니다.