02_class
코드 블록의 Try it Yourself 버튼으로 직접 실행할 수 있다.
구문
자바스크립트 클래스(JavaScript Class)
ℹ️INFO
1. 개요
- class ? 객체 팩토리(공장) Class는 객체의 모양과 동작에 대해 미리 정의해 놓은 틀 클래스는 객체의 기본값(속성)을 정해놓고 메소드를 여러번 정의하기 위해씀
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Classes
클래스 정의하기
클래스는 class 키워드를 사용하여 정의됩니다.
class ClassName {
// 클래스 내용
}
클래스 생성자
클래스는 생성자를 가질 수 있습니다. 생성자는 클래스의 객체를 만들 때 호출되며 객체의 초기 상태를 설정하는 데 사용됩니다.
class ClassName {
constructor() {
// 생성자 내용
}
}
클래스 메소드
클래스 내에서 메소드는 함수와 같이 정의됩니다. 메소드는 클래스의 객체에서 호출됩니다.
class ClassName {
constructor() {
// 생성자 내용
}
methodName() {
// 메소드 내용
}
}
클래스 상속
클래스는 다른 클래스를 상속할 수 있습니다. 상속은 extends 키워드를 사용하여 정의됩니다.
class ChildClassName extends ParentClassName {
// 클래스 내용
}
참고: 위의 코드는 ES6에서 도입된 새로운 구문입니다. 따라서 구형 브라우저에서는 작동하지 않을 수 있습니다.
2. class 선언

클래스는 생성자함수와 메서드를 갖는다
- Dog 클래스에 생성자 함수를 선언하고 name 속성에 값을 할당한다. printName 함수에 name 을 콘솔로 출력하는 내용을 작성한다.

class Dog{
constructor(){
this.name="mango"
}
printName(){
console.log(this.name);
}
}
const dog= new Dog();
dog.printName();
- 상수에 new 키워드로 클래스 인스턴스를 할당한다
- 이제 상수 dog 은 Dog 인스턴스의 메소드를 사용할수 있다
3. class 상속
class Breed{
constructor(){
this.kind="말티즈";
}
printKind(){
console.log(this.kind)
}
}
class Dog** extends Breed**{
constructor(){
** super();**
this.name="망고"
}
printName(){
console.log(this.name);
}
}
const dog= new Dog();
dog.printName();
dog.printKind();
Dog 는 Breed 의 속성을 상속받는다 서브클래스 Dog 에서는 super() 메소드를 호출해야 한다.