클래스 (정의와 사용법)

ES6에서의 클래스

자바스크립트는 프로토타입 기반 객체지향언어이다. 프로토타입 기반 객체지향 언어는 클래스가 필요없어 ES5에서는 생성자함수로 사용가능했다.

var Person = (function () {
	function Person(name) {
		this.name = name;
	}
	// 프로토타입 메서드
	Person.prototype.sayHi = function () {
		console.log('hi, I am' + this.name);
	}
	
	return Person;
}());

// 인스턴스 생성
var me = new Person('Lee')
me.sayHi(); // 'hi, I am Lee'

ES6에 들어서 다른 객체지향 언어와 흡사한 클래스 기반의 패턴을 제공한다. 클래스와 생성자 함수는 모두 프로토타입 기반의 인스턴스를 생성하지만 몇 가지 차이가 있다.

	클래스	생성자함수
new 연산자	없으면 에러	일반 함수처럼 동작
extends / super	상속 제공	x
호이스팅	없는 것처럼 동작	함수/변수 호이스팅
strict mode	암묵적 지정	x
기타	constructor, 프로토타입 메서드, 정적 메서드는 기본적으로 [[enumerable]] 값이 false로 설정되어 있으며, 열거되지 않음. 클래스의 내부 동작과 관련된 메서드들은 사용자에게 직접 노출되지 않아야 하기 때문.

클래스의 정의

클래스틑 일반적으로 파스칼케이스로 작성한다.

class Car {}

// 익명 클래스 표현식
const Car = class {};

// 기명 클래스 표현식
const Car = class MyCar {}

클래스가 표현식으로 정의될 수 있다는 것은 일급객체라는 것을 의미한다.

무명의 리터럴로 생성 가능 (런타임에서 생성 가능)
변수/자료구조에 저장 가능
함수 매개변수에게 전달 가능
함수 반환값으로 사용 가능

클래스 사용

클래스에 정의할 수 있는 메서드는 세 가지다.

• constructor
• 정적 메서드
• 프로토타입 메서드

class Person {
  constructor(name) {
    this.name = name;
  }
  
  sayHi() {
    console.log('안녕하세요' + this.name)
  }
  
  static sayHello() {
    console.log('Hello')
  }
}