[JavaScript_study] static, 인스턴스(instance)레벨, 클래스(Class)레벨

* static (static 키워드는 클래스의 정적 메서드를 정의한다.)

// static 정적 프로퍼티, 메서드
class Fruit {
  static MAX_FRUITS = 4;
  // 생성자: new 키워드로 객체를 생성할때 호출되는 함수
  constructor(name, emoji) {
    this.name = name;
    this.emoji = emoji;
  }

  // 클래스 레벨의 메서드
  static makeRandomFruit() {
    // 클래스 레벨의 메서드에서는 this를 참조할 수 없음
    // 주어진 데이터가 없는 템플릿 자체이므로 this를 참조할 수 없다.
    return new Fruit('banana', '🍌');
  }

  // 인스턴스 레벨의 메서드
  display = () => {
    console.log(`${this.name}: ${this.emoji}`);
  };
}

const banana = Fruit.makeRandomFruit();
console.log(banana);
console.log(Fruit.MAX_FRUITS);
// apple은 Fruit 클래스의 인스턴스이다.
const apple = new Fruit('apple', '🍎');
// orange은 Fruit 클래스의 인스턴스이다.
const orange = new Fruit('orange', '🍊');

console.log(apple);
console.log(orange);
console.log(apple.name);
console.log(apple.emoji);
apple.display();

// static이 사용된 예시 (내장객체에서 static이 사용된 예시)
Math.pow();
Number.isFinite(1);

 

[인스턴스(instance)레벨]

* Class에 정의된 프로퍼티와 메서드는 인스턴스(instance)레벨의 프로퍼티와 메소드이다.
  > Class를 이용해서 만든 인스턴스에 Class에서 정의한 프로퍼티와 메서드들이 중복적으로 만들어지기 때문이다.
  > 템플릿을 지정해두고 필요한 데이터를 주입해서 동일한것을 지속적으로 만들어 나갈 수 있다.
  > 이때 동일한 프로퍼티와 메서드가 들어가기 때문에 인스턴스 레벨의 프로퍼티와 메서드라고 볼 수 있다.
  > 그래서 만들어진 인스턴스를 통해서 객체.속성 // 객체.함수()를 통해서 호출이 가능하다.

[클래스(Class)레벨]

* 인스턴스 레벨의 프로퍼티와 메소드는 객체마다 서로 다른 데이터를 가지고 있다. 

하지만 만약 우리가 모든객체마다 동일하게 참조해야하는 속성이나 행동이 있다면? 어떻게 해야할까?
  > Class레벨의 프로퍼티와 메서드를 사용한다.
  > Class안에서 static이라는 키워드를 프로퍼티나 메서드앞에 추가 가능하다.
  > static이 붙은 프로퍼티나 메서드는 만들어진 인스턴스에 포함이 되지 않고 Class에 그대로 남아있게된다.
  > 즉, Class에 딱 한번만 만들어지고 각각의 인스턴스에는 들어있지않다. (Class에 한번만 정의하고 재사용 가능)
  > 그래서 호출할때도 클래스이름.함수()를 통해 Class레벨에 있는 메서드를 호출가능하다.