상세 컨텐츠

본문 제목

Subclassing in ES6 - Javascript

Programming/Concept

by 쌩우 2019. 6. 9. 18:22

본문

기존의 ES5와는 달리,
ES6에서 subclassing을 하는 방법을 알아본다.

class Human {                        //function으로 생성자 함수를 만들지 않고, class 라는 명령어로 만든다.
    constructor(x,y) {                //class 명령어로 생성될 것의 property를 지정해준다.
    this.x = x;
    this.y = y;
}    
    move(){                            //prototype이 지닐 method를 생성해준다.
        this.x++;
        this.y++;
    }
}

class rumee extends Human {            // extends를 통하여 Human이 가진 prototype 객체를 복사 붙여넣기 해준다. constructor는 rumee로 유지된다.
    constructor(x,y) {
    super(x,y)                        //super를 통하여 Human이 가지고 있던 property를 가져온다. Human.call(this)와 같은 느낌이다.
}
    move() {                        //Polymorphism. rumme 클래스는 Human 클래스의 move method에 기능을 추가하여 기존보 x를 2만큼 더 많이 더해준다.
    super.move();
    this.x += 2;
}
}

let reumreum = new rumee(1,2)
undefined
reumreum
rumee {x: 1, y: 2}
reumreum.move()
undefined
reumreum
rumee {x: 4, y: 3}                        //실제로 rumee의 subclass는 move를 실행하였을때, x 값이 기존보다 +1 +2 하여 최종적으로 +3 되는 것을 볼 수 있다.

관련글 더보기

댓글 영역