JS ES6 - Class

클래스란?

객체 지향 프로그래밍에서 클래스는 특정 객체를 생성하기 위해 변수와 함수를 정의하는 일종의 틀.

객체를 정의하기 위한 상태와 함수로 구성되어 있고, 객체 단위로 코드를 그룹화하고 쉽게 재사용하려고 사용한다.

 

클래스의 구성

클래스 안에는 객체를 정의하기 위한 상태(property)와 함수가 있다.

class Cat {
	// 생성자 함수
  constructor(name) {
		// 여기서 this는 이 클래스입니다.
		this.name = name; 
	}

	// 함수
	showName(){
		console.log(this.name);
	}
}

let cat = new Cat('perl');
cat.showName();
console.log(cat);

• 생성자 함수: 클래스 인스턴스를 생성하고 생성한 인스턴스를 초기화(초기 값을 설정)하는 역할.

 

클래스의 상속

이미 만들어 둔 부모 클래스를 가지고 자식 클래스를 만드는것.

class Cat {
	// 생성자 함수
  constructor(name) {
		// 여기서 this는 이 클래스입니다.
		this.name = name; 
	}

	// 함수
	showName(){
		return this.name;
	}
}

// extends는 Cat 클래스를 상속
class MyCat extends Cat {
	// 생성자 함수
  constructor(name, age) {
		// super를 메서드로 사용하기
		super(name); 
		this.age = age; 
	}
	
	// 부모 클래스가 가진 것과 같은 이름의 함수를 만들 수 있다.
	// 오버라이딩
	showName(){
		// super를 키워드로 사용하기
		return '내 고양이 이름은 '+super.showName()+'입니다.';
	}
	
	showAge(){
		console.log('내 고양이는 '+this.age+'살 입니다');
	}
}

let my_cat = new MyCat('perl', 4);
my_cat.showName();
my_cat.showAge();

 

Super

• 메소드로 사용할 수 있다.(constructor 안에서)
  • 부모의 constructor를 호출하면서 인수를 전달한다.
  • this를 쓸 수 있게 해준다.
• 키워드로 사용할 수 있다.
  • 부모 클래스에 대한 필드나 함수를 참조할 수 있다.