객체 지향 프로그래밍 (Object Oriented Programming)의 3요소
객체 지향 프로그래밍은 컴퓨터 프로그램을 명령어의 목록으로 보는 시각에서 벗어나 객체들의 모임으로 보려는 패러다임입니다. 각 객체들은 서로 독립된 단위로 데이터를 주고받습니다. 객체 지향 프로그래밍의 3요소는 다음과 같습니다.
1. 캡슐화
프로그램 내에서 어떤 기능을 목적으로 작성된 코드를 모아서 다른 곳(클래스)에서 안 보이게 숨기는 것입니다. 캡슐화를 하면 정보은닉이 됩니다.
2. 상속
클래스 사이에 부모와 자식이 존재하여 자식 클래스는 상속받은 부모 클래스의 변수 및 메소드를 사용할 수 있습니다.
3. 다형성
형태가 같은데 다른 기능을 하는 것을 의미합니다. 오버라이딩과 오버로딩 두 가지로 나눌 수 있습니다.
오버라이딩: 부모 클래스에서 정의되어 있는 내용을 자식 클래스에서 재정의하여 사용하는 것입니다.
오버로딩: 같은 이름을 가진 메소드를 인자 값의 종류에 따라 다른 로직을 수행하도록 분기하는 것입니다.
프로토타입으로 객체 지향 프로그래밍 구현
자바스크립트 ES6버전에서 클래스 문법을 제공하기 전까지는 객체 지향 프로그래밍을 하기 위해 프로토타입 문법을 사용해야 했습니다.
1. 캡슐화
캡슐화를 구현하기 위해 필요한 것은 정보은닉입니다. 클래스가 아닌 함수 문법에서 정보은닉을 하기 위해서 생성자 함수에서 this를 사용하지 않고 변수를 함수 스코프에 가두는 방법을 사용합니다. 생성자 함수에서 this를 사용한 변수는 public 멤버가 되어 인스턴스가 자유롭게 접근 가능하지만, 따로 변수를 만들면 인스턴스가 접근할 수 없는 private 멤버가 되어 따로 접근할 수 없게 됩니다.
var Job = function (job) {
var _job = job ? job : ''; // private 변수는 _로 시작하기로 네이밍규칙 정합니다. private 키워드가 따로 없기 때문입니다.
this.job = job; // public 변수
}
var me = new Job("developer");
console.log(me._job); // undefined
console.log(me.job); // developer
생성자 함수를 다음과 같이 같은 함수명을 사용하여 명시할 수 있습니다. 생성자 함수를 반환해줘야하므로 즉시 실행 함수인 익명 함수를 하나 만듭니다.
var Job = (function () {
// 인스턴스 변수
var _job;
var _income = 0;
// 생성자 함수
var Job = function(job) {
_job = job ? job : '';
this.job = job;
}
// 메소드
Job.prototype.print = function () {
console.log(_job, this.job, _income);
}
return Job;
})();
var me = new Job("developer");
console.log(me._job); // undefined
console.log(me.job); // developer
console.log(me._income); // undefined
console.log(Job._income); // undefined
me.print(); // developer developer 0
2. 상속
위 예제에 부모 함수를 만들어 상속을 해보겠습니다. 우선 부모 함수로 사용할 Person 함수를 만듭니다.
var Person = (function() {
var _name;
var _age;
var Person = function(name, age) {
_name = name ? name : "";
_age = age ? age : "";
}
Person.prototype.introduce = function () {
console.log("My name is " + _name + " and " + _age + " years old.");
}
return Person;
})();
그리고 Job 함수는 Person 함수를 상속받도록 만듭니다.
var Job = (function () {
var _job;
var _income = 0;
var Job = function(name, age, job) {
Person.apply(this, arguments); // 부모 멤버 초기화
_job = job ? job : '';
this.job = job;
}
Job.prototype = Object.create(Person.prototype); // 프로토타입 상속
Job.prototype.constructor = Job; // 생성자 함수 자식 본인 것을 사용하도록 바로 잡기
Job.prototype.print = function () {
console.log(_job, this.job, _income);
}
return Job;
})();
var me = new Job("cocoder", "N", "developer");
me.print(); // developer developer 0
me.introduce(); // My name is cocoder and N years old.
Job으로 만든 me 인스턴스는 부모 함수 Person의 메소드인 introduce를 사용할 수 있습니다.
3. 다형성
자식 함수인 Job의 print 메소드를 introduce의 오버라이딩 메소드로 바꿔보겠습니다.
var Job = (function () {
var _job;
var _income = 0;
var Job = function(name, age, job) {
Person.apply(this, arguments);
_job = job ? job : '';
this.job = job;
}
Job.prototype = Object.create(Person.prototype);
Job.prototype.constructor = Job;
Job.prototype.introduce = function () {
console.log("My job is " + _job + " and income is " + _income, ".");
}
return Job;
})();
var me = new Job("cocoder", "N", "developer");
me.introduce(); // My job is developer and income is 0.
클래스로 객체 지향 프로그래밍 구현
같은 내용을 ES6에서 도입된 클래스 문법으로 구현해보겠습니다.
class Person {
constructor(name, age) {
this.name = name; // public
this.age = age;
}
introduce() {
console.log("My name is " + this.name + " and " + this.age + " years old.");
}
}
class Job extends Person { // 상속
#income = 0; // ES10 문법에서는 #으로 private을 선언할 수 있는 기능이 추가되었다.
constructor(name, age, job) {
super(name, age);
this.job = job;
}
introduce() { // 오버라이딩
console.log("My job is " + this.job + " and income is " + this.#income, ".");
}
}
var me = new Job("cocoder", "N", "developer");
me.introduce(); // My job is developer and income is 0.
ES6 클래스 문법에서는 private을 선언할 수 있는 기능이 없었으나 ES10에서는 #키워드가 도입되어 private을 선언할 수 있게 되었습니다.
최근댓글