JavaScript 문법 - static 메소드 및 static 프로퍼티

🐱‍🏍 Class 및 instanc

앞서 배열 리터럴을 생성하면, 그 배열은 Array라는 생성자 함수로
new 연산자와 함께 호출한 결과물과 같다고 살펴보았다.

📝 클래스란?

배열 리터럴 부분을 제외한 Array 생성자 함수만 분리해서 보면,
이 부분이 바로 일반적인 개념 상의 Class 역할을 담당한다.

Array라는 생성자 함수는 그 자체로 어떤 특별한 기능을 수행하기 보다는 주로 new 연산자를 통해 생성한 배열 객체의 기능을 정의하는데 주력하고 있기 때문이다.

또한 배열에서만 쓰이는 메서드들은 모두 Array.prototype에 정의되어있음을 앞서 살펴보았다.

📔 instance란?

Class를 통해 생성한 객체 여기서는 배열 객체❗
이 객체를 instance 라고 한다.
구체적인 데이터를 지니고, 실제 코드상에서 동작을 수행하는 실체 중 하나이다.

---

😎 static methods 및 static property

👀 static methods, static property란?

• prototype property 내부에 할당되지 않고, Array 생성자 함수 객체에 직접 할당되어 있는 property

• 이들을 static method, static properties 라 칭한다

• 이들은 Array 생성자 함수를 new 연산자 없이 함수로써 호출할 때에만 의미가 있다.

• 보통 해당 Class의 소속인 instance들의 개별적인 동작이 아니라,
  소속 여부의 확인, 소속 부여 등의 공동체적인 판단을 필요로 하는 경우에 static 메서드를 활용하곤 한다.

💻 prototype methods란?

• prototype property 내부에 정의된 메서드들을 일컬어 prototype methods라고 한다.

• 일반적으로는 prototype를 생략하고 methods라고 부르는 경우가 많다.

---

📌 class와 instance의 관계 살펴보기

static한 값들은 왼쪽에, prototype methods는 우측에 두었다.

이 둘은 instance에서 직접 접근 가능한가❓❕

prototype methods는 instance의 __proto__로 연결 되어 있고 __proto__는 생략 가능하기 때문에 instance에서 direct로 접근 가능하다.

반면 생성자 함수 내부에 있는 property나 methods들은 direct로 접근 할 방법이 없다

물론, prototype의 constructor를 통해 우회하는 법은 가능하지만 instance를 this를 하기 위해서는 별도의 처리가
필요하며 그런 처리에 의해서도 정상적인 동작을 기대하기는 어렵다.

---

🎥 예제를 통해 살펴보기

• 생성자 함수 Person에서 prototype으로 선언한 getName(), getAge() 메서드는 prototype methods 이기 때문에 gomu.getName(), gomu.getAge()가 정상적으로 작동한다.

• 반면, 생성자 함수 Person에서 static method로 선언한 getInformations() 메서드는 instance로 접근할 경우 Error가 발생한다.

✔ 에러가 발생하는 이유

• prototype chaining은 대각선으로만 검색하기 때문에 static 메서드에서 제대로 된 결과를 얻기 위해서는 instance가 아니라 생성자 함수에서 직접 접근해야 한다

🎓 정리

Class는 어떤 공통된 속성이나 기능을 정의하기 위한 추상적인 개념이며, 이 Class에 속한 객체를 instance라고 한다.

Class에는 instance에서는 직접 접근할 수 없는 Class 자체에서만 접근 가능한 static 멤버와 instance에서 직접 활용 할 수 있는 prototype 메서드가 있다

ref