본문 바로가기

Programming/JavaScript

[Javascript] Static Method

 

Static Method(정적 메소드)

 

정적 메소드란 생성자의 프로토타입 속성에 할당되어있지 않고 클래스 자체에 직접 할당되어있는 메소드이다.

정적 메소드는 인스턴스 객체로는 접근할 수 없고 클래스로만 접근할 수 있다.

 

 

자바스크립트에서 생성자는 생성자 함수를 통해 만들 수 있다.

 

  • 생성자함수
function Person (gender, name) {
  this.gender = gender;
  this.name = name;
}

Person.prototype.introduce = function () {
  return `안녕하세요 제 이름은 ${this.name}입니다`;
}

const person1 = new Person("여자", "은빈");
person1.introduce(); // "안녕하세요 제 이름은 은빈입니다"

 

생성자함수의 프로토타입 프로퍼티로 정의된 introduce() 메소드는 생성자함수를 이용해 만든 person1 인스턴스로 직접 접근할 수 있다.

 

ES6이후에는 Class가 도입되어 객체를 생성할 수 있게 되었다.

 

Class는 기존의 생성자함수를 좀 더 간편하게 작성할 수 있게 만들어진 Syntactic suger이며 문법만 다를 뿐, 동일하게 작동한다.

 

  • Class
class Person {
  constructor(gender, name) {
	  this.gender = gender;
    this.name = name;
  }

  introduce() {
    return `안녕하세요 제 이름은 ${this.name}입니다`;
  }
}

const person1 = new Person("여자", "은빈");
person1.introduce(); // "안녕하세요 제 이름은 은빈입니다"

 

위 예제에서 각각의 Person 생성자에 정의되어있는 inroduce() 메소드인스턴스 메소드이다.

 

인스턴스 메소드란 생성자의 프로토타입 속성에 정의되어있거나 해당 인스턴스 내에 정의되어있어 인스턴스 객체가 직접적으로 접근할 수 있는 프로퍼티와 메소드를 말한다.

 

person1은 __proto__를 통해 Person의 프로토타입과 연결되어있어 직접적인 접근이 가능하다.

 

person1.__proto__ === Person.prototype   ➡️   person1(.__proto__).introduce()

 

반대로 정적 프로퍼티, 정적 메소드란 생성자로 만든 인스턴스에서는 접근 불가능하고 생성자 자체에서만 직접적으로 접근할 수 있는 정적 멤버(static member)이다.

 

  • 클래스를 이용해 정적 메소드 구현하는 방법
class Person () {
  static staticMethod() {
    return this === User;
  }
}

Person.staticMethod(); // true

const person1 = new Person();
person1.staticMethod(); // 접근 불가능(error)

 

  • 생성자함수를 이용해 정적 메소드 구현하는 방법
function Person() {}

Person.staticMethod = function () {
  return this === User;
}

Person.staticMethod(); // true

const person1 = new Person();
person1.staticMethod(); // 접근 불가능(error)

 

두 생성자에서 staticMethod라는 정적 메소드를 정의했다.

 

이 정적 메소드는 생성자 자체에서만 접근이 가능하다.

 

 

*인스턴스에서도 property의 constructor 속성을 이용하면 static 메소드에 접근이 가능하다.

 

  • 생성자함수의 인스턴스에서 static 메소드에 접근하는 방법
function Person() {}

Person.staticMethod = function () {
  return this === User;
}

Person.staticMethod(); // true

const person1 = new Person();

person1.constructor.staticMethod(); // false

 

인스턴스를 통해 staticMethod() 메소드에 접근이 가능하기는 하지만 제대로된 this할당이 되고있지 않다.

 

이 부분도 임의적인 바인딩을 통해 this의 값을 설정해줄 수는 있지만 코드를 읽는 사람으로 하여금 혼란을 줄 수 있고 정상적인 동작도 보장되지 않는다.

 

static 메소드를 언제, 왜 사용할까?

 

정적 메소드를 통해 특정한 인스턴스가 아닌 생성자에 속한 함수를 구현할 수 있다.

 

주로 주어진 인자에 대해 소속 여부 확인, 소속 부여 등 "전체"와 관련된 기능을 필요로 하는 유틸리티 함수를 만드는 데 사용된다.

 

  • Array.inArray([판별하고자하는 대상]) : 이 메소드는 판별하고자하는 대상의 데이터타입이 array인지를 판단하는 메소드이다. 본인의 데이터타입이 배열이 맞는지를 판단하는 메서드가 본인(인스턴스) 내에 속해있는 것은 적절하지 않다. 따라서 이 메소드는 static 메소드로 구현되어야한다

    이 메서드는 위에서 말한 '소속 여부를 확인'하는 역할을 하고있는 메서드이다.

 

  • Array.from([배열로 변환할 iterable객체]) : 이 메소드는 다른 자료구조를 배열로 바꾸는 역할을 한다. 즉 Array 생성자로 만들어지지 않은 다른 객체를 array로 만들어주는 메서드 또한 인스턴스 내에 속해있는 것은 적절하지 않다.