자바스크립트의 class

클래스는 객체를 생성하기 위한 템플릿이다. 자바스크립트는 원래 prototype이라는 것을 기반으로 생성했지만 ES5부터는 class라는 키워드로 클래스를 선언할 수 있다.
  붕어빵 틀로부터 나오는 붕어빵을 생각하면 쉽다. 클래스로부터 객체가 되며 객체가 컴퓨터상의 메모리에 올라가게 되면 인스턴스가 된다.

메모리에 올라가는 과정을 인스턴스화라고 한다.

• prototype : 자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있다. 그리고 이것은 마치 객체 지향의 상속 개념과 같이 부모 객체의 프로퍼티 또는 메소드를 상속받아 사용할 수 있게 하는데, 이때의 부모 객체를 prototpye이라고 한다.

var student = {
  name: 'Lee',
  score: 90
};

// student에는 hasOwnProperty 메소드가 없지만 아래 구문은 동작한다.
console.log(student.hasOwnProperty('name')); // true

console.dir(student);

constructor

개체 초기화를 위한 메서드. class에는 constructor 한개만 가능.

class Rectangle {
  constructor(height, width) {
this.height = height;
this.width = width; }
}
const p = new Rectangle();

※ 클래스로 객체를 만들때는 new로 만들어야한다.

static

클래스에 대한 정적 메서드 또는 속성을 정의하며 클래스의 인스턴스에서 호출이 불가하다.

1. 중복되는 함수, 데이터를 정의할 때 쓰임(메모리 이점)
2. 이 클래스의 객체들끼리 사용되는 메서드나 속성이다. 라는 명시성이라는 장점이 있다.

class Point { 
  constructor(x, y) {
	this.x = x;
	this.y = y; 
  }
  static displayName = "Point"; 
  static distance(a, b) {
	const dx = a.x - b.x; 
    const dy = a.y - b.y; return Math.hypot(dx, dy);
  } 
}

static으로 선언시, 인스턴스에 묶여있지 않고 class 자체 내에서 호출되기 때문에 중복생성이 안된다.

static 변수를 자주 사용하게 되었을때의 단점

static은 일종의 전역변수라 전역변수의 단점 일부를 가지고 있다.
하지만 전역변수와는 다르게 get, set 함수를 만들 수 있다.(전역변수보다는 조금 더 간접접근을 할 수 있다) 클래스에서 사용된다는 명시성을 가진다는 점 등이 다르다.

• 동시성 문제 : 여러 스레드에서 해당 전역변수를 참조하게 된다고 할 때, 만약 해당 static 변수가 변경된다면 다른 모든 스레드에 영향을 주기 때문에 사이드 이펙트가 일어나 안전하지 않을 수 있다.

• 메모리 문제 : 클래스가 생성될 때 메모리를 할당, 그리고 프로그램 종료시점에 반환되므로 사용하지 않아도 메모리가 할당되어있다.
  근데 만약에 이걸 객체에다가 집어넣은 메서드의 경우 사용하지 않을 경우에는 메모리 할당이 일어나지 않는다.

→ static으로 선언한 add라는 함수가 있을 때, add라는 함수를 사용하지 않아도 메모리가 할당된다.

• 테스트 문제 : 단위테스트를 한다고 하면 해당 메서드, 함수만을 실행해야 하는데 static으로 한 경우 단위적이지 않고 전역적으로 관리되기 때문에 해당 부분을 깨끗하게 테스팅하기가 어렵다.

https://poiemaweb.com/js-prototype