TIL_210226

jeyoon·2021년 2월 26일

Today I Learned

OOP
Prototype

OOP란?

OOP(Object Oriented Programming, 객체 지향 프로그래밍)는 컴퓨터 프로그래밍의 패러다임 중 하나이다. 프로그램을 단순히 데이터와 처리 방법으로 나누는 것이 아니라, 프로그램을 수많은 '객체(object)'의 단위로 나누고 이들의 상호작용으로 보는 방식이다. 객체란 하나의 역할을 수행하는 '메소드와 변수(데이터)'의 묶음으로 봐야 한다.

객체 지향 프로그래밍의 4가지 주요 개념에 대해 알아보자.

캡슐화(Encapsulation)

캡슐화는 속성과 메소드를 하나의 객체에 묶는 것이다.
캡슐화는 클래스를 통해 구현된다. 즉, 속성과 메소드를 "클래스"라는 "캡슐"에 분류해서 넣는 것이다.
관련된 기능과 특성을 한 곳에 모아 분류하기 때문에 재사용이 원활해진다

은닉(hiding)

프로그램의 세부 구현이 외부로 드러나지 않도록 특정 모듈 내부로 감추는 것으로, 캡슐화를 하는 중요한 목적 중 하나이다.
클래스를 기준으로 보면, 클래스 외부에서는 바깥으로 노출된 특정 메소드에만 접근이 가능하며 클래스 내부에서 어떤 식으로 처리가 이루어지는지는 알지 못하도록 설계된다.
내부의 디테일한 데이터나 기능은 숨기므로, 언제든 수정할 수 있다. (유지 보수에 용이)
외부에서의 간섭으로 발생하는 오류를 방지한다.

function makeCounter() {
  let level = 0 // 속성 
  return { 
    increase: function() { // 메소드
      level++ 
    },
    decrease: function() {
      level--
    },
    getLevel: function() {
      return level;
    }
  }
} // 클래스 사용자가 직접 level에 접근할 수 없고, getLevel만 이용가능하다.(은닉)

let counter1 = makeCounter()
counter1.increase()
counter1.getLevel() // 1

let counter2 = makeCounter()
counter2.decrease()
counter2.decrease()
counter2.getLevel() // -2

추상화(Abstraction)

객체 지향 프로그래밍에서 추상화(Abstraction)는 객체들의 공통적인 프로퍼티와 메서드를 뽑아내는 작업
위의 코드에서 사용자는 어떻게 level이 오르고 내리는 지 그 원리는 알 수 없다. 즉, 추상화는 사용자에게 객체를 단순화시켜 필요한 기능만 보여주는 방식이다.

상속(Inheritance)

부모 클래스(Base class)의 특징을 자식 클래스(derive class)가 물려받는 것
자식 클래스는 상속받은 속성과 기능을 사용할 수 있으며 기능의 일부분을 변경해야 할 경우 자식 클래스에서 상속받은 그 기능만을 수정(다시 정의)해서 다시 정의할 수 있다. 이러한 작업을 '오버라이딩(Overriding)'이라고 한다.
상속받은 속성과 메소드에 필요한 기능을 추가할 수 있다.

다형성(Polymorphism)

하나의 변수명, 함수명 등이 상황에 따라 다른 의미로 해석될 수 있는 것

OOP 사용의 장단점

코드 재사용이 용이
프로그램의 개발과 보수가 쉬움
대형 프로젝트에 적합
- 클래스 단위로 모듈화시켜서 개발할 수 있으므로 대형 프로젝트처럼 여러명, 여러회사에서 개발이 필요할 시 업무를 분담하기 쉽다.
처리 속도가 상대적으로 느림
객체가 많으면 용량이 커질 수 있음
설계 시 많은 시간과 노력이 필요

Prototype

JavaScript에서 Prototype은 무엇인가?

자바스크립트는 흔히 프로토타입 기반 언어라고 불린다.
자바스크립트의 모든 객체는 자신의 부모 객체와 연결되어 있는데, 이것은 객체 지향의 상속개념과 같이 부모 객체의 속성과 메소드를 상속받아 사용할 수 있게 한다.
이러한 부모 객체를 프로토타입 객체 또는 줄여서 프로토타입이라 한다.
프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수도 있고 그 상위 프로토타입 객체도 마찬가지이다. 이를 프로토타입 체인(prototype chain)이라 부른다.

Prototype Chain 작동 예시

function Ultra(){
Ultra.prototype.ultraProp = true;
}

function Super(){
Super.prototype = new Ultra();
} 

function Sub(){
Sub.prototype = new Super();
} 

var o = new Sub();
console.log(o.ultraProp); // true

o.ultraProp을 출력하는 메커니즘은 아래와 같다.

객체 o에서 ultraProp을 찾는다.
없다면 Sub.prototype.ultraProp을 찾는다.
없다면 Super.prototype.ultraProp을 찾는다.
없다면 Ultra.prototype.ultraProp을 찾는다.

만약 찾는 대상이 발견되면, 더 이상 상위 객체로 가지 않고 리턴한다.
이와 같이 prototype은 객체와 객체를 연결하는 체인의 역할을 한다.
prototype은 함수만 가지는 속성이며, __proto__ 는 모든 객체가 빠짐없이 가지고 있는 속성이다.

super

super 키워드는 부모 객체의 함수를 호출할 때 사용된다.

extends

extends 키워드는 클래스를 다른 클래스의 자식으로 만들기 위해 class 식에 사용된다.

super, extends 예시 ⬇️

class Person{
    constructor(name, first, second) {
        this.name = name;
        this.first = first;
        this.second = second;
    }
    sum() {
        return this.first + this.second;
    }
}

class PersonPlus extends Person {
    constructor (name, first, second, third) {
        super(name, first, second);
        this.third = third; // 부모 객체에 없는 키를 추가해준다
    }
    sum() { // 부모객체에 있는 함수를 쓸 수 있다.
        return super.sum() + this.third;
    }
    avg() { 
        return (this.first + this.second + this.third)/3;
    }
}

let kim = new PersonPlus("kim", 10, 20, 30)
console.log(kim.sum()); // 60
console.log(kim.avg()); // 20

instanceof

instanceof 연산자는 object의 프로토타입 체인에 constructor.prototype이 존재하는지 판별한다.

function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}
var mycar = new Car("Honda", "Accord", 1998);
var a = mycar instanceof Car;    // returns true
var b = mycar instanceof Object; // returns true