객체 지향 프로그래밍(OOP)

• 객체 지향 프로그래밍(Object Oriented Programming)은, 절차 지향 프로그래밍과는 다르게 데이터와 기능을 한데 묶어서 처리

• 속성과 메소드가 하나의 객체라는 개념에 포함되며, 이는 자바스크립트 내장 타입인 object와는 다르게, 클래스(Class)를 사용

• 하나의 모델이 되는 청사진(Class)을 만들고, 그 청사진을 바탕으로 한 객체(Instace)를 만드는 프로그래밍 패턴

Class

class Car {
  // 속성
  constructor(brand, name, color) {
    this.brand = brand;	
    this.name = name;
    this.color = color;
  }
  // 메소드
  refuel() {
  }
  
  drive() {
  }
}   

클래스를 만드는 암묵적인 규칙으로, 보통 클래스는 대문자, 그리고 일반명사로 만든다.

객체 지향 프로그래밍에서 생성자(constructor) 함수라고 부르고 인스턴스가 만들어질 때 실행되는 코드 생성자 함수는 return값을 만들지 않는다.

this는 인스턴스 객체를 의미

Instance

let avante = new Car('hyundai', 'avante', 'white');

let sonata = new Car('hyundai', 'sonata', 'gray');

let grandeur = new Car('hyundai', 'grandeur', 'black');

인스턴스를 만들 때에는 new 키워드를 사용하고 즉시 생성자 함수가 실행되며, 변수에 클래스의 설계를 꼭 닮은 새로운 객체, 즉 인스턴스가 할당됨

각각의 인스턴스는 클래스의 고유한 속성과 메소드를 갖음

new Array() - MDN

let fruits = new Array('사과', '바나나');

console.log(fruits.length) // 2
console.log(fruits[0])     // "사과"

배열을 정의하는 것은 Array의 인스턴스를 만들어내는 것과 동일

객체 지향 프로그래밍의 특징

1. 캡슐화

하나의 객체 안에 넣어서 묶는 것이고 속성과 기능들이 느슨하게 결합되는 것

느슨한 결합은 코드 실행 순서에 따라 절차적으로 코드를 작성하는 것이 아니라 코드가 상징하는 실제 모습과 닮게 코드를 모아 결합하는 것을 의미

캡슐화에 은닉화라는 특징도 있는데 이것은 내부 데이터나 내부 동작이 외부로 노출되지 않도록 만드는 것
=> 디테일한 구현이나 데이터는 숨기고, 동작만 노출

엄격한 클래스는 속성의 직접적인 접근을 막고, 설정하는 함수(setter), 불러오는 함수(getter)를 철저하게 나누는 방법도 있다.

2. 추상화

추상화는 내부 구현은 아주 복잡한데, 실제로 노출되는 부분은 단순하게 만든다는 개념
=> 클래스 정의 시 메소드와 속성만 정의한 것인 인터페이스(interface)를 단순화

너무 많은 기능들이 노출되지 않은 덕분에 예기치 못한 사용상의 변화가 일어나지 않도록 만들 수 있다.

캡슐화가 코드나 데이터의 은닉에 포커스가 맞춰져있다면, 추상화는 클래스를 사용하는 사람이 필요하지 않은 메소드 등을 노출시키지 않고, 기능 단순한 이름으로 정의하는 것에 포커스가 맞춰져 있다.

3. 상속

상속은 부모 클래스의 특징을 자식 클래스가 물려받는 것

=> 기본 클래스(base class)의 특징을 파생 클래스(derive class)가 상속받는다

자바스크립트에서는 extends 키워드 및 super 키워드를 이용해서 상속을 구현

4. 다형성

똑같은 메소드라도 다른 방식으로 구현될 수 있음

OOP의 특징과 관련된 장점

1. 캡슐화는 코드가 복잡하지 않게 만들고, 재사용성을 높임

2. 추상화는 마찬가지로 코드가 복잡하지 않게 만들고, 단순화된 사용으로 인해 변화에 대한 영향을 최소화

3. 상속 역시 불필요한 코드를 줄여 재사용성을 높임

4. 다형성으로 인해 동일한 메소드에 대해 if/else if와 같은 조건문 대신 객체의 특성에 맞게 달리 작성하는 것이 가능

Prototype

JavaScript는 프로토타입 기반 언어이고 프로토타입(Prototype)은 원형 객체를 의미

=> 모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미

Prototype chain(__proto__)

객체 지향 프로그래밍에서의 "상속"의 특성은 JavaScript에서 프로토타입 체인으로 구현

__proto__를 이용하면 부모 클래스의 프로토타입, 혹은 '부모의 부모 클래스'의 프로토타입을 탐색(prototype의 주소를 가짐) => 참조 가능

Prototype - MDN

prototype / constructor / this

	prototype	constructor	this
개념	모델의 청사진을 만들 때 쓰는 원형 객체	인스턴스가 초기화될 때 실행되는 생성자 함수	함수가 실행될 때 해당 scope마다 생성되는 고유한 실행 context, new 키워드로 인스턴스를 생성했을 때 해당 인스턴스가 바로 this의 값이 됨