JavaScript OOP & Prototype

OOP(Object Oriented Programming)

"클래스"라는 데이터 모델을 사용하여 똑같은 인스턴스들을 찍어서 만들어 내는 것을 객체지향 프로그래밍 이라고 할 수 있다.
객체지향을 사용하는 이유는 캡슐화, 상속, 추상화, 다형성 의 특징을 사용할 수 있기 때문이다.
첫째, 캡슐화는 클래스 내부에 있는 값들을 외부에 노출되지 않도록 숨기는 것, 즉 "은닉화"를 사용하여 재사용을 가능하게 해준다.
둘째, 추상화는 복잡한 불필요한 부분들은 보여주지않고 단순히 동작만을 보여주기 위함이다.
셋째, 부모와 자식 관계처럼 자식 클래스가 필요할때 부모 클래스의 특징을 물려받아와 사용할 수 있다.
넷째, 다형성은 똑같은 클래스를 물려받아 사용하더라도 각자의 자식의 클레스 특성에 맞게 다양한 방식으로 구현 할 수 있다.

JavaScript에서의 Prototype

Prototype 은 원형 이라는 뜻을 갖고있고 JavaScript 에서의 Prototype 도 이 뜻에 크게 벗어나지 않는다. JavaScript 에서의 Prototype 은 부모의 객체를 상속하기 위하여 사용하는 방식이다. 객체 인스턴스와 프로토 타입간에 연결이 되어있어 객체가 프로토 타입의 속성을 이용할 수 있다. JavaScript 에서는 Class가 존재하지 않았다. 그래서 Class처럼 객체를 생성하기 위해 prototype이 생겨났다.

function Person (firstName, lastName, age){
	this.firstName = firstName;
    this.lastName = lastName;
    this.age =age;

}

let kim = new Person('Junrae','Kim', 20);

라는 객체가 생성된다고 가정하자. Person 이라는 객체가 생성되면 Person의 property 에는 prototype 이 생기고 동시에 Person의 prototype 이라는 객체도 동시에 생성되는데 이 Person's prototype의 property 에는 constructor 가 생성된다. Person 의 prototype 은 Person's prototype 을 가리키고 Person's prototype 의 속성인constructor 은 Person 의 prototype을 가리키게된다. Person 의 새로운 객체를 만들면 kim이라는 instance는 Person의 속성인 firstName,lastName,age를 가져오는 동시에 proto라는 property를 갖게되는데 이 proto는 Person이 가리키는 Person's prototype을 가리키게된다.
proto는 객체인 Person의 prototype 의 속성에 접근할수 있다.

Javascript Inheritance (상속)

JavaScript 에서의 Class는 object를 찍어 내기 위한 공장과도 같다. JavaScript 에서의 Inheritance의 키워드를 보자면 extends 와 super가 주로 쓰인다. extend는 부모클레스를 상속 받기 위한 키워드이다. class ChildClass extends ParentClass. 자식 Class 가 부모의 class 의 속성을 가져와 확장 시킨다 라고 생각하면 쉬울 것 같다. super 키워드는 부모 class 의 모든 오브젝트의 함수를 호출할 때 사용된다. 객체를 생성하면 항상 생성되는 constructor로 예시를 들면 constructor 를 호출해 부모의 constructor 속성을 모두 가져온다. 부모의 constructor 속성을 그대로 이용하기에 쓰기 좋은 키워드이다.

class Person{
	constructor(firstName, lastName, age){
    this.firstName = firstName;
    this.lastName = lastName;
    this.age = age;
    }

Person 이라는 클래스가 주어져 있다고 가정하고 개발자 라는 child class 를 만들어 Person 의 속성을 상속받아 온다고 가정해보자.

class Developer extends Person{
	constructor(firstName,lastName,age, yearOfExperience){
    	super(firstName,lastName,age);
    	this.yearOfExperience = yearOfExperience;
    }
	
}

Instance 생성

let kim = new Person('Junrae','Kim',20);
let developer_Kim = new Developer('Junrae', 'kim', 20, 30);

extends 키워드를 사용함으로써 자식클래스인 Developer 는 Person 의 부모클래스의 모든 속성을 사용할 수 있게되고 super 키워드를 사용함으로써 자식클래스는 부모 클레스인 Person 의 constructor 을 그대로 가져와 사용할 수 있다.

좋은 웹페이지 즐겨찾기