LHJ

I'm a FE developer.

9.2.2 클래스는 함수다

10 May 2020 » js_lj

ES6에서 class 키워드를 도입하기 전까지, 클래스를 만든다는 것은 곧 클래스 생성자로 사용할 함수를 만든다는 의미였습니다.
class 문법이 훨씬 더 직관적이고 단순하긴 하지만, 사실 class는 단축 문법일 뿐이며 자바스크립트의 클래스 자체가 바뀐 것은 아닙니다.
따라서 자바스크립트의 클래스 자체를 이해하는 것이 중요합니다.

클래스는 사실 함수일 뿐입니다.
ES5에서는 Car 클래스를 다음과 같이 만들었을 겁니다.

function Car(make, model) {
	this.make = make;
	this.model = model;
	this._userGears = ['P', 'N', 'R', 'D'];
	this._userGear = this.userGears[0];
}

ES6에서도 똑같이 할 수 있습니다.
결과는 완전히 동일합니다.
다음 예제를 보십시오.

function Es5Car(make, model) {
	this.make = make;
	this.model = model;
	this._userGears = ['P', 'N', 'R', 'D'];
	this._userGear = this.userGears[0];
}

class Es6Car {
	constructor(make, model) {
		this.make = make;
		this.model = model;
		this.userGears = ['P', 'N', 'R', 'D'];
		this.userGear = this.userGears[0];
	}
}

typeof Es5Car // "function"
typeof Es6Car // "function"

ES6에서 클래스가 바뀐 것은 아닙니다.
단지 간편한 새 문법이 생겼을 뿐입니다.