[F-Lab 모각코 챌린지 - 63일차] - 클래스

Big One·2023년 7월 12일
0

F-Lab

목록 보기
36/69

Public, private 필드 선언

클래스 내에 변수를 지역 변수를 필드라고 부릅니다. constructor(생성자) 보다 위에 정의해여하며,
public - 일반 변수 선언처럼 하면 됩니다.
private - 식별자 앞에 # 을 붙입니다

class Person {
	name: 'BigOne';   // public field name, age 선언
	age: 26;
	constructor(name , age){
		this.name = name;
		this.age = age;
	}
}

class Person {
	#name: 'BigOne';   // private field #name, #age 선언
	#age;
	constructor(name, age){
		this.#name = name;
		this.#age = age;
	}
}

상속

클래스는 extends 키워드로 상속을 받을 수 있습니다.
subClass 에서 constructor를 사용한다면, this를 사용하기 전에 super()를 호출해야합니다.

class Animal {
	constructor(name){
		this.name = name;
	}
	
	speak() {
		console.log(`${this.name} 는 동물입니다.`);
	}
}

class Dog extends Animal {
	constructor(name){
		super(name);
	}

	speak() {
		console.log(`${this.name} 은 강아지 입니다.`);
	}
}

const dog1 = new Dog('강아지');
dog1.speak(); // 강아지 은 강아지 입니다.

생성자가 없는 객체를 상속할 경우

객체 변수, 함수?(되는지 확인 필요함), 등 생성자를 갖지 않는 객체일 경우 상속을 하면 TypeError가 발생됩니다. 만약 기존의 생성자가 없는 객체를 상속(extends, 확장) 하려하면 Object.setPrototypeOf() 메서드를 사용합니다.

구문

Object.setPrototypeOf(상속 받을 클래스, 상속할 객체);

예시

// 일반 객체
const Animal = {
	speak() {
		console.log(`${this.name} 은 Animal인 일반 객체입니다.`);
	}
}

class Dog {
	constructor(name){
		this.name = name;
	}
}

// constructor 없는 객체 상속
Object.setPrototypeOf(Dog.prototype, Animal);

const dog1 = new Dog('puppy');
dog1.speak(); // puppy 은 Animal인 일반 객체입니다.

super 를 통한 상위 클래스 호출

super 키워드는 객체의 부모가 가지고 있는 메서드를 호출하기 위해 사용됩니다. 즉, super을 사용하면 부모 객체에 접근이 가능합니다. 이는 프로토타입 기반 상속보다 좋은 점 중 하나힙니다.

class Cat {
	constructor(name){
		this.name = name;
	}
	speak() {
		console.log(`${this.name} 냐옹~`);
	}
}

class Lion extends Cat {
	speak(){
		super.speak();
		console.log(`${this.name}  어흥!!`);
	}
}

const lionKing = new Lion('King');
lionKing.speak(); // King 냐옹~
									// King 어흥!!

Mix-ins

클래스는 하나의 클래스만 상속 받을 수 있는데, 믹스인(Mix-ins)을 사용하면 여러 클래스, 객체를 상속받을 수 있습니다. (implements 느낌? ) 아직 사용하는 경우가 없는 것 같으니 사용할 날이 오면 예제 확인해보자!

var calculatorMixin = Base => class extends Base {
  calc() { }
};

var randomizerMixin = Base => class extends Base {
  randomize() { }
};

// 믹스인 적용 
class Foo { }
class Bar extends calculatorMixin(randomizerMixin(Foo)) { }
profile
이번생은 개발자

0개의 댓글