보다 나은 자바스크립트 - 메서드

메서드는 간단히 말해 자바스크립트의 객체에서 사용 할 수 있는 함수라고 할 수 있습니다.
일반적으로 메서드는 어떤 일을 수행하기 위한 객체의 속성을 말합니다.
이 전 포스팅에서 예를 든 Car 생성자를 다시 살펴보겠습니다.

function Car(make, model, year) {
  //중간 생략
  this.toString = function() {
    return this.make + " " + this.model + " (" + this.year + ")";
  }
}

toString속성이 객체에 추가 되었습니다.
해당 속성은 함수이며 현재 객체의 make, model, year의 문자열을 반환하고 있습니다.
메서드는 다음과 같은 형식으로 생성자 내부 뿐만 아니라 언제,어디서든 추가 될 수 있습니다.

//이전 포스팅에서 myCar라는 생성자를 만들었었습니다.
myCar.isOld = function() {
  return (new Date().getFullYear() - this.year) > 5;
}

myCar에 isOld라는 새로운 메서드가 추가 되었습니다.
myCar가 5년이 넘었는지의 여부를 반환해주고 있습니다.
(Date().getFullYear()는 Date 내장객체의 getFullYear라는 메서드를 수행합니다. 현재년도(2008)을 반환합니다.)

만약, 하나의 객체가 아닌 모든 객체에 메서드를 추가 하고 싶을 수 있습니다. 그렇게 하기 위해서는 생성자 내부에서 메서드를 추가 하거나 다음 포스팅에서 설명 할 prototype이라는 속성을 사용해야 합니다.

메서드는 this라는 특별한 키워드를 통하여 객체의 모든 속성을 사용 할 수 있습니다. 파라미터 모델로 형성 되어지며, 같은 영역의 변수로 정의됩니다.

위 예제에서 사용한 toString메서드는 Car생성자에게 파라미터를 받아 사용하고 Car생성자의 지역변수와 같은 변수영역을 가지게 됩니다. 처음 자바스크립트를 다루는 분들이 이 부분에서 많은 혼란을 겪게 됩니다.
아래는 많이 실수하는 코드 입니다.

function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.toString = function() {
    return make + " " + model + " (" + year + ")";
  }
}

var myCar = new Car("Holden", "SS Ute", 2005);
alert(myCar.toString());
myCar.make="Calais";
alert(myCar.toString());

위의 코드를 실행해 보면 먼저 "Holden SS Ute (2005)"라는 경고창이 발생 합니다.
그리고 myCar.make="Calais";가 수행되어 두번째 경고창은 "Holden Calais (2005)"라는 경고창이 발생할 것이라 기대하지만 첫번째 경고창과 같은 결과가 나타납니다.

이런경우 우리가 생성자에 넘겨주는 값을 변경 하고자 하여도 toString메서드는 잘못된 결과값을 제공 할 것입니다.