JavaScript - 클래스

Syntactic Sugar

자바스크립트의 class는 문법적 설탕이다.

내부 기능은 프로토타입으로 동작한다.

 

추후 프로토타입 자세히 탐구

 

Syntactic Sugar - 문법을 보다 읽기 쉽게 만드는 것 - (눈속임, 포장)

 

자바 등 타 언어에 익숙한 사람들을 위해 생성자 함수, 프로로타입 기반인

자바스크립트 문법 타 언어의 클래스와 비슷한 문법으로 포장

 

클래스가 이런식으로 만들어진것 - 익숙하게 사용할 수 있게

 

but 클래스와 생성자 함수와 완전히 동일하지 않음

 

• 클래스는 호이스팅 되지 않는다.  => 엄밀히 말하면 틀린말 호이스팅 되지만, tdz로 인해 접근 불가 한 것이다.
• new 없이 사용할 시 오류 발생 ( 생성자 함수는 undefined 됨 ) => class 사용시 엄격모드를 자동적으로 적용하게 됨

 

 

클래스 사용 예시 코드

 

---

생성자 constructor

인자를 받아 프로퍼티는 초기화 하는 기능

인자의 defalut 값 사용가능

constructor 는 필수가 아니다.

 

constructor 예시 코드

field

constructor 밖에서 this.~ 없이 인스턴스의 프로퍼티를 정의

 

필드 값으로 지정한 프로퍼티는 각 인스턴스 개별의 값이다.

 

초기값이 같을 뿐 참조값 및 원시값은 다른 값이다.

 

클래스의 메서드

클래스에서 생성된 인스턴스의 메서드는 프로토타입에 정의 되어있다.

생성자 함수에서 생성된 인스턴스는 인스턴스 자체가 메서드를 가지고 있다

프로토타입 방법 : 매번 사용할 때 마다 본사 ( 생성자 함수 ) 에서 알려주는 방식

 

정적 static 필드와 메서드

메서드 및 필드는 각각 메모리 공간을 차지하며 독립적

staic 정적 필드 및 메서드

인스턴스들의 값이 같은 메모리 공간을 공유하여 사용

 

클래스는 함수

자바스크립트 내에서 클래스도 함수로 구현하여 동작하는 것이다.

JS 함수의 특징인 일급 객체의 특성을 사용할 수 있다.

 

 

클래스의 주요 특징

메모리 사용: 클래스를 사용하면 모든 인스턴스가 메서드의 단일 복사본을 공유하므로 메모리 사용이 효율적

 

문법의 간결함: 클래스 문법은 생성자 함수에 비해 메서드 정의와 상속을 더 명확하고 간결하게 만듭니다. 또한 super 키워드를 통해 부모 클래스의 메서드에 쉽게 접근할 수 있습니다.

 

결론:

메모리 효율성: 클래스를 사용하면 모든 인스턴스가 메서드를 공유하기 때문에 메모리 사용이 더 효율적

문법적 명확성: 클래스 문법은 생성자 함수와 프로토타입을 사용하는 방식보다 더 명확하고 현대적인 방법을 제공

기능적 유사성: 기능적으로는, 클래스와 생성자 함수는 유사한 결과를 달성할 수 있지만, 클래스가 더 새로운 기능과 더 나은 구문을 제공