class - static method, property

1. static method

prototype 프로퍼티가 아닌

클래스 함수 자체에 메서드를 설정할 수 있습니다.

이런 메서드를 static method ( 정적 메서드 ) 라고 부릅니다.

class Animal {
  static staticMethod(){
    console.log(this === Animal)
  }
}

class Animal {}
Animal.staticMethod = function(){
  console.log(this === Animal)
}


Animal.staticMethod() // true

class 내에서 static 메소드를 선언 하는 것은

메서드를 프로퍼티 형태로 직접 할당하는 것과 같습니다.

 

static 메소드는 호출시 class명.method( ) 의 형태로 사용하게 되며,

이때 static 메소드의 this는 'class' 가 됩니다.

---

2. static method 의 쓰임새

static 메소드는 각각의 인스턴스 객체가 아닌,

클래스 전체에 필요한 기능을 구현하고자 할때 사용할 수 있습니다.

class Summoner {
  constructor({name, power = 10}){
    this.name = name;    
    this.power = power;    
  }

  static createDummySummoner(){
    return new Summoner({name: 'dummy', power: 0})
  }
}

let summoner = new Summoner({name : 'Bob'})
let dummy = Summoner.createDummySummoner()

console.log(summoner) // {name: 'Bob', power: 10}
console.log(dummy) // {name: 'dummy', power: 0}

위 코드에선

클래스에 static 메서드 createDummySummoner를 선언했습니다.

더미 소환사가 필요할 때마다 Summoner.createDummySummoner( ) 를 호출하면 됩니다.

위 static 메서드는 전체 클래스의 메서드입니다.

---

3. static property

정적 프로퍼티도 만들 수 있습니다.

class Summoner {
  static dummyName = 'dummy';
]

Summoner.dummyName = 'dummy'

정적 메소드와 동일하게

class 내에서 static property를 선언 하는 것은

프로퍼티를 직접 할당하는 것과 같습니다.

---

4. static property 의 쓰임새

class Summoner {
  constructor({name, power = 10}){
    this.name = name;    
    this.power = power;    
  }

  static dummyName = 'dummy';

  static createDummySummoner(){
    return new Summoner({name: this.dummyName , power: 0})
  }

  static setDummyName(name){
    this.dummyName = name
  }

}

let summoner = new Summoner({name : 'Bob'})
let dummy = Summoner.createDummySummoner()

console.log(summoner) // {name: 'Bob', power: 10}
console.log(dummy) // {name: 'dummy', power: 0}

Summoner.setDummyName('poop')
let dummy2 = Summoner.createDummySummoner()

console.log(dummy2); // {name: 'poop', power: 0}

console.log(summoner.dummyName) // undefined
console.log(Summoner.dummyName) // dummy

정적 프로퍼티는 데이터를 클래스 수준에 저장하고 싶을 때 사용합니다.

위 코드의 맨 아랫줄과 같이 정적 프로퍼티는 인스턴스가 아닌 클래스에 저장됩니다.

---

5. static 의 상속

정적 프로퍼티와 메소드는 상속됩니다.

class Summoner {
  constructor({name, power = 10}){
    this.name = name;    
    this.power = power;    
  }

  static dummyName = 'dummy';

  static createDummySummoner(){
    return new Summoner({name: this.dummyName , power: 0})
  }

  static setDummyName(name){
    this.dummyName = name
  }
}

class SubSummoner extends Summoner{}

let dummy = SubSummoner.createDummySummoner()
console.log(dummy) // {name: 'dummy', power: 0}
console.log(SubSummoner.dummyName) // dummy

위 코드를 보면

부모 클래스 Summoner에 선언된 static 메소드와 프로퍼티가

자식 클래스 SubSumonner에서 사용 가능한 것을 알 수 있습니다.

 

위와 같은 동작이 가능한 이유는 prototype 상속 때문입니다.

extends 키워드로 상속을 사용할 때 다음과 같은 일이 일어납니다. 

1. 자식 클래스는 [[Prototype]] 을 통해 부모클래스를 상속받습니다.

2. 자식 클래스.prototype 은 [[Prototype]] 을 통해 부모클래스.prototype을 상속받습니다.

 

1번을 통해

자식 클래스에서

부모클래스에 저장된 static 메소드와 프로퍼티를 상속받고 사용할 수 있고,

 

2번을 통해

자식 클래스의 인스턴스에서

자식 클래스와 부모 클래스의 메소드를 사용할 수 있습니다.

---

요약

1. static method는 클래스의 인스턴스가 아닌 클래스 전체에 필요한 기능을 만들 떄 사용하다.

2. static property는 데이터를 클래스 수준에 저장하고 싶을 때 사용한다.

3. 1,2번은 기술적으로 클래스 자체에 직접 할당하는 것과 동일하다.

 

4. static은 자식 클래스의 [[ Prototype ]] 을 통해 부모 클래스에게 상속 받아 사용할 수 있다.

 

 

 

 

gogo