객체 지향 프로그래밍 (OOP : Object Oriented Programming)

오늘 호그와트에 등록했다. 질문받는다.

---

OOP에 대해서 알아보자

OOP(Object Oriented Programming)은 한국말로는 객체 지향 프로그래밍을 말한다. 

 

하나의 기준이 되는 청사진(blueprint)를 만들고, 그 청사진을 바탕으로 한 객체(object)를 만드는 프로그래밍 패턴이다.

예를 들어 호그와트에 새로운 학생이 입학을 했고, 정보를 입력하는 것을 구현 해본다면 아래의 코드처럼 작성이 될 것 같다.

let name = 'codingLee';
let house = 'Gryffindor';
let grade = 'Freshman';

//
let student = {
  name = "codingLee",
  house = "Gryffindor",
  grade = "Freshman"
}

학교 학생이 1명이라면 이렇게 작성해서 저장하면 되지만, 만약에 학생이 10명? 100명? 1000명이라면 각 변수에 1~1000까지 숫자를 붙여서 계속해서 작성해야한다면...? 난 자신없다.... 안볼란다....

 

하지만 객체 지향적으로 클래스를 만들어서 그룹핑을 하게 되면 깔끔하게 해결이 된다.

// ES6
class Student {
 constructor (name, house, grade) {
  this.name = name;
  this.house = house;
  this.grade = grade;
 }
}

let student1 = new Student('codingKim', 'Slytherin', 'Freshman');
// student1 {name: "codingKim", house: "Slytherin", grade: "Freshman"}

let student2 = new Student('codingChoi', 'Ravenclaw', 'Freshman');
// student2 {name: "codingChoi", house: "Ravenclaw", grade: "Freshman"}

이렇게 새로운 student라는 class를 만들어주고 새로운 학생들이 등록할때마다 new 키워드와 함께 값만 넣어주게되면 착착 값들이 들어가게 된다. 

 

그래서 객체 지향 프로그래밍은 클래스(class)라는 서랍장 안에 서로 연관된 메소드(method)나 변수(variable)들을 모아서 그룹핑을 하고 이름을 정해서 정리정돈을 한다. 클래스를 중심으로 프로그램의 구조를 만들어가는 것을 말한다.

 

[constructor는 인스턴스를 생성하기 위해 쓰인다]

 

그리고 OPP는 캡슐화(Encapsulation), 상속(Inheritance), 추상(Abstraction), 다형(Polymorphism)  4가지의 특징을 가지고 있다.

 

---

OPP의 특징 4가지

1. 캡슐화(Encapsulation)

• 하나의 클래스 안에 서로 관련이 있는 메소드나, 변수를 모아서 하나로 정돈 하는 것을 말한다.

• 말그래도 밖에 선언되어있고, 만들어 놓은 함수들을 연관성 있는 아이들을 상자속에 넣어서 정리 정돈을 하는 것이다.

2. 상속(Inheritance)

• 상속은 기존 클래스를 바탕으로 새롭게 클래스를 정의할 수 있게 도와주는 것을 말한다.

• base class (부모) => derive class (자식) 부모의 특징을 물려받는 것을 말한다.

3. 추상(Abstraction)

• 내부에 메소드가 어떻게 구현이 되어있는지 몰라도 사용자가 사용하기 쉽게 만들어 주는 것을 말한다.

• 우리는 계산기의 내부 작동원리, 구조 등은 알지못한다. 하지만 우리는 숫자와 연산자를 입력하기만 하면 계산기를 값을 알려준다. 우리가 원리를 이해하지 못해도 사용만 하면된다.

4. 다형(Polymorphism)

• 상속에서 자식은 부모에게 물려받을 수 있다. 그리고 자식들은 상황에 맞게 같은 메소드라도 상황에 맞게 다르게 구현될 수 있다.

---

자바스크립트(JavaScript)에서 Object를 생성하는 방법

ES6전에는 class라는 것이 없었다. 그래서 JavaScript를 객체지향적으로 사용하기 위한 다양한 시도가 있었다. 그렇다면 ES6이전에 class를 만들고, 객체와 인스턴스를 만드는지 알아보자!

 

1. Functional Instantiation 

이 방식은 함수를 이용해서 찍어내는 방식이다. 호출이 될 때 마다 새로운 인스턴스(객체)를 반환하는 함수이다. 

var pluspoint = function(){
  var someInstance = {};
  someInstance.point = 0;
  someInstance.givepoint = function(value){
    this.point = this.point + value;
  }
  return someInstance;
}

var pluspointLee = pluspoint();
var pluspointKim = pluspoint();
pluspointLee.givepoint(100);

이렇게 하면 앞으로 해당하는 학생에게 점수를 부여할 수 있게된다. 이 방법은 인스턴스를 생성할 때 마다 모든 메소드를 할당하게 되서, 인스턴스들이 메소드의 수만틈 메모리를 차지 아기 때문에 효율적이지 못하다!(이번에도 그리핀 도르 우승~ 슬리데린 우우우우우~~~)

 

2.  functional-shared 

이 방법은 이전의 방법이 효율적이지 못해서 등장하게 된 객체를 생성하는 방법이다.

var pluspoint = function(point){
  var someInstance = {
    point : point
  };
  extend(someInstance, someMethods);
  return someInstance;
};
var extend = function(target, source){
  for(let key in source){
    target[key] = source[key];
  }
};
var someMethods = {};
someMethods.givePoint = function(value){
  this.point = this.point + value;
};

var pluspointLEE = pluspoint(100);
var pluspointKim = pluspoint(50);

이 방식을 사용한다면, someMethods라는 객체에 있는 메소드들의 메모리 주소만을 참조하기 때문에 메모리 효율이 좋아진다.

 

3. prototypal 

Object.create(source)를 활용해서 작성하는 방식이다. Object.create()는 특정 객체를 프로토타입(prototype)으로 하는 객체를 생성해주는 함수다.

var pluspoint = function(point){
  var someInstance = Object.create(someInstance);
  someInstance.point = point;
  return someInstance;
};
var someMethods = {};
someMethods.givePoint = function(value){
  this.point = this.point + value;
};
var pluspointLee = pluspoint(100);
var pluspointKim = pluspoint(50);

 

4. psuedo classical

인스턴스를 생성할 때 new operator를 붙여서 사용하는 방법이다.

var pluspoint = function(point){
  this.point = point;
}
minuspoint.prototype.givePoint = function(){
  this.point = this.point - value;
}
var pluspointLee = new givepoint(10);
var pluspointKim = new givepoint(5);

코드를 작성해주고, 메소드를 프로토 타입으로 만들어준다. 그리고 new를 사용해서 찍어내면 된다!

 

---

prototype은 뭐하는 친구인가?

자바스크립트는 객체 지향 프로그래밍 언어는 아니다. 프로토타입 기반 언어이다. 그렇기 떄문에 프로토타입의 개념이 중요하다. 그렇다고 해서 자바스크립트에서 객체지향 프로그래밍을 못하는 것은 아니다. 클래스 없이도 만들 수 있다.

(하지만 다행이도 지금은 ECMAScript 6에서 클래스가 추가 되었다! 후 하 후 하)

 

자바스크립트의 객체들은 부모 객체와 연결이 되어 있다. 그렇기 떄문에 상속이라는 특징을 활용해서 프로퍼티나 메소드를 사용할 수 있게 되었다. 이 때 자신을 생성하기 위해 사용된 객체 원형(부모 객체) Prototype이라고 한다. 자바스크립트의 모든 객체는 Object 객체의 프로토 타입을 기반으로 만들어 지기 때문에 이 연결의 끝은  프로토타입 Object이다.

 

으으... 머리아파 다음은 무엇을 기록해볼까!