들어가기 전에
function Person(name, age){
this.name = name;
this.age = age;
}
Person.prototype.isAdult = function(){
if(this.age > 20) return '성인입니다.';
else return '청소년입니다.';
}
const mark = new Person('Mark', 23);
const bob = new Person('Bob', 14);
console.log(mark.isAdult());
console.log(bob.isAdult());
생성자 함수: 데이터는 생성자 함수에서, 이를 조작하는 것은 프로토 객체에 따로 작성
class: 객체를 생성하기 위한 템플릿으로 데이터와 이를 조작하는 코드를 하나로 추상화한다.
-> 비록 자바스크립트에서 클래스는 프로토타입을 이용해서 만들어졌지만 ES5의 클래스 의미와는 다른 문법과 의미를 가진다
class Person{
constructor(name, age){
this.name = name;
this.age = age;
}
isAdult(){
if(this.age > 20){
return `${this.name}은 성인입니다.`
}else{
return `${this.name}은 청소년입니다.`
}
}
}
const mark = new Person('Mark', 23);
const bob = new Person('Bob', 14);
console.log(mark.isAdult()); // 'mark은 성인입니다.'
console.log(bob.isAdult()); // 'bob은 입니다.'
Class를 정의하는 방법 중 하나는 class 선언을 이용하는 것이다. class를 선언하기 위해서는 클래스의 이름(여기서 "Rectangle")과 함께 class 키워드를 사용해야 한다.
class Rectangle {
constructor(height, width) {
this.height = height;
this.width = width;
}
}
class Person{
constructor(name, age){
this.name = name;
this.age = age;
}
isAdult(){
if(this.age > 20){
return `${this.name}은 성인입니다.`
}else{
return `${this.name}은 청소년입니다.`
}
}
}
function Person2 (name, age){
Person.call(this,name,age); // Person이 생성자 함수라고 가정
}
Person2.prototype = Object.create(Person.prototype);
Person2.prototype.constructor = Person2;
class Person2 extends Person {
constructor(name, age){
super(name, age);
}
}
const mark = new Person2('Mark', 23);
const bob = new Person2('Bob', 14);
console.log(mark.isAdult()); // 'mark은 성인입니다.'
console.log(bob.isAdult()); // 'bob은 청소년입니다.'
console.log(mark instanceof Person2); // true
console.log(mark instanceof Person); // true