OOP란?

Object-Oriented Programming 객체를 지향하는 프로그래밍이다.
OOP는 언어가 가지는 패러다임 입니다.
객체지향 프로그래밍은 함수들의 집합 혹은 단순한 컴퓨터의 명령어들의 목록이라는 전통적인 절차지향 프로그래밍과는 다른, 관계성있는 객체들의 집합이라는 관점으로 접근하는 소프트웨어 디자인으로 볼 수 있다.
대표적으로 절차지향적 언어는 C가 있고, 객체지향적 언어는 Java가있습니다.

"사람이 세계를 보고 이해하는 방법을 흉내낸 방법으로 코드를 작성한다."

코드로 확인하기

아래 코드에서 확인 할 수 있는것은 자동차가 가지는 특징(property), 기능(method)을 가지는 객체를 선언 했는지 아닌지의 차이 입니다.
절차지향 코드에서 여러 자동차를 생성하고 싶다면 maker, name, maxSpeed라는 변수 즉, 특징(property)을 새로 선언을 해줘야하는 반면, 객체지향에서는 객체로 묶여있는 요소를 가지는 변수명을 다르게 하여 여러대의 자동차를 만들어 낼 수있습니다.
간편하게 새로운 자동차를 만들어 낼 수 있다는 것은 생산성이 좋다라는 것입니다.

//절차지향
let maker = 'bmw';
let name = '320d';
let maxSpeed = 200;

function forward(speed){return console.log(`최고속도 ${speed}으로 달리고있습니다!!`);}
function reverse(){}
function toot(){console.log('빵빵!!')}
forward(maxSpeed);//최고속도 200으로 달리고있습니다!!


//객체지향
let car  = {
  maker : "bmw",
  name : "320d",
  maxSpeed : 200,
  forward  : function(){ return console.log(`최고속도 ${this.maxSpeed}으로 달리고있습니다!!`)},
  reverse  : function(){},
  toot  : function(){console.log('빵빵!!')}
}
car.forward();//최고속도 200으로 달리고있습니다!!

JavaScript OOP의 특징

1. 캡슐화 (Encapsulation)

객체가 선언되면 데이터를 보호 할 필요가 있습니다. 외부에서 객체 내 데이터에 바로 접근할 수 없게 만드는 것이 캡슐화 입니다. 다른 말로 정보에 대한 은닉이라하여 은닉화라고도 합니다.

2. 상속성 (Inheritance)

부모의 객체를 자식이 물려받아 사용한다 해서 상속이란 개념을 사용합니다.
즉, 부모의 객체안에 선언되어있는 기능을 자식 객체에게 상속한다, 또는 확장한다라고 합니다.
JavaScript에서는 prototype을 이용한 객체 차원의 상속을 말합니다.

3. 추상화 (Abstraction)

객체는 여러 특징(property), 기능(method)를 가지게 됩니다. 수많은 객체는 서로다른 특징과 기능을 가질수도, 완전히 똑같을 수도 있습니다.
여러 객체의 공통분모를 하나로 만들어 defult객체 즉, 부모객체로 만들어 주고 상속이라는 기능으로 기능을 확장해서 만든다면 코드중복 방지, 재사용성의 향상을 얻을 수 있습니다.

4. 다향성 (Polymorhism)

부모객체에서 물려받은 method를 자식 객체내에서 오버라이딩(재정의) 하여 사용하는것입니다.

JavaScript instantiation Patterns

JavaScript에 class가 나오기 전에 사용했던 4가지 class선언 방식.

1. Functional

Car()를 실행 할 때마다 someInstance 객체를 생서한다.
someInstance객체는 특징과 method를 할당하여 객체로 추가된다.
단점으로 생성할때마다 method를 가지고 있기때문에 메모리를 많이 차지한다.
method 중복에 대한 문제를 해결하지 못하고있다.

var Car = function(){
  var someInstance  = {};
  someInstance.position = 0;
  someInstance.move = function(){
    this.position += 1;
  }
  return someInstance;
}
var car1 = Car();
var car1 = Car();
car1.move();
console.log(car1.position);//1

2. Functional Shared

functional과 크게 다를바 없지만 extend라는 함수를 생성하고 사용할method의 집합을 만들어 놓는것으로 functional에서 method중복을 해결할 수 있다.

var extend = function(to, from){
  for(var key in from){
    to[key] = from[key];
  }
};
var someMethods = {};
someMethods.move = function(){
  this.position += 1;
}
var Car = function(position){
  var someInstance  = {
    position:position,
  };
  extend(someInstance, someMethods);
  return someInstance;
}
var car1 = Car(5);
var car1 = Car(10);

3. Prototype

Object.create를 사용한 방법.
Object.create는 특정 객체를 prototype으로 하는 객체를 생성해 준다.

var someMethods = {};
someMethods.move = function(){
	this.position += 1;
}
var Car = function(position){
  var someInstance  = Object.create(someMethods);
	someInstance.position = position;
  return someInstance;
}
var car1 = Car(5);
var car2 = Car(10);

4. Pseudoclassical

인스턴스를 생성하는 생성자 new키워드를 사용한다.

var Car = function(position) {
	this.position = position;
}
Car.prototype.move = function(){
	this.position += 1;
}
var car1 = new Car(5);
var car2 = new Car(10);

prototype 이란?

prototype 프로퍼티

함수 객체만 가지고 있는 프로퍼티이다.
함수 객체가 생성자로 사용될 때, 이 함수를 통해 생성될 객체의 부모 역할을 하는 객체(Prototype 객체)를 가리킨다.
즉, Prototype 객체란 어떠한 객체가 만들어지기 위해 그 객체의 모태가 되는 객체이고 하위 객체들에게 물려줄 속성들이다.

[ [ Prototype ] ] __proto__ 프로퍼티

함수를 포함한 모든 객체가 가지고 있는 인터널 슬롯이다.
객체의 입장에서 자신의 부모 역할을 하는 Prototype 객체를 가리킨다.
ECMAScript에서는 암묵적 프로토타입 링크(implicit prototype link)라 부르며 proto 프로퍼티에 저장된다.
Prototype 프로퍼티는 함수의 입장에서 자신과 링크된 자식에게 물려줄 프로토타입 객체를 가리키고, proto 프로퍼티는 객체의 입장에서 자신의 부모 객체인 프로토타입 객체를 내부의 숨겨진 링크로 가지고 있는 것이다.

constructor 프로퍼티

프로토타입 객체는 constructor 프로퍼티를 가진다.
constructor 프로퍼티는 생성된 객체(인스턴스)의 입장에서 자신을 생성한 함수를 가리킨다.
참고 : https://iamsjy17.github.io/javascript/2019/06/10/js33_17_prototype.html