Blogging - OOP in JavaScript JS 21.04.09
in Dev on Java Script
OOP(Object Oriented Programming) 객체 지향 프로그래밍
개념
프로그램 설계 방법론이자 일종의 개념으로, 프로그램을 단순히 데이터와 처리방법으로 나누는 것이 아니라, 수많은 object(기능에 따른 method와 변수의 묶음)라는 기본 단위로 나누고 이를 상호작용하는 방식
특징 (추상화, 캡슐화, 상속, 다형성)
캡슐화
변수와 함수를 하나의 단위로 묶는 것을 의미. 이는 class를 통해 구현. 이 class의 instance 생성을 통해 class 안에 포함된 변수와 method에 쉽게 접근 할 수 있다.
캡슐화는 정보의 은닉이라는 특징도 가진다. 코드의 세부 구현을 외부에 드러나지 않고 특정 모듈 내부로 감추는 것이다. class를 기준으로 class 외부에서는 바깥에 노출된 특정 method에만 접근이 가능하며 class 내부에서 어떤 식으로 처리가 이루어지는지 알지 못하도록 설계. 외부 노출을 최소화하여 모듈 간의 결합도를 떨어뜨려 유연함고 유지 보수성을 높이는 개념.
상속
부모 클래스의 속성(property)과 기능(method)을 자식 클래스가 그대로 물려 받는 것. 상속 받은 속성과 기능의 일부를 변경(추가/삭제/변경)해야할 경우 자식 클래스에서 재정의(오버라이딩) 할 수 있다. 상속은 캡슐화를 유지하면서 Class의 재사용성을 높여준다.
추상화
내부 구현은 아주 복잡한데, 실제로 노출되는 부분은 단순하게 만든다는 개념. 캡슐화가 코드나 데이터의 은닉에 포커스가 맞춰져있다면, 추상화는 클래스를 사용하는 사람이 필요하지 않은 메소드 등을 노출시키지 않고, 기능 단순한 이름으로 정의하는 것에 포커스가 맞춰져 있습니다. 추상화의 본질 : 클래스 정의 시, 메소드와 속성만 정의한 것을 인터페이스.
다형성
하나의 변수, 또는 함수가 상황에 따라 각각 다르게 작동하거 다른 결과 값 return (this, parameter, argument 등으로 가능)
Prototype - JavaScript
Prototype Programming
object의 원형인 prototype을 이용해 새로운 object를 만들어내는 프로그래밍 기법. prototype을 이용해 만들어진 object 역시 prototype을 갖는다. 다시 이 object의 prototype을 이용하면 또 새로운 object를 만들 수 있고 이렇게 반복되는 과정을 cloning이라 하며 object의 특성을 확장해 나가며 새로운 object를 생성한다. (재귀와 느낌이 비슷?)
Prototype
object를 생성하기 위해 사용 된 객체 원형을 prototype이라고 한다. 자바스크립트의 모든 object는 자신을 생성한 object의 prototype에 대한 숨겨진 연결을 갖고 있다. 모든 object는 Object 객체의 prototype을 기반으로 확장 되었기 때문에 이 연결의 끝은 Object 객체의 prototype Object다.
function A() {};
// new Operator를 사용하여 A라는 object를 생성하여 b라는 변수에 담는다.
let a = new A();
console.log(a);
// 결과 값
A {}
// a의 프로토타입은 A라는 함수객체
__proto__:
// __proto__ : a라는 객체를 만들어내기 위해 사용된 객체원형에 대한 숨겨진 연결.
constructor: ƒ A()
// 이 객체의 생성자(constructor) 역시 function A() 함수
__proto__: Object
// 즉 new Operator를 통해 만들어진 객체 a는 function A()를 자신의 프로토타입으로 사용하여 만들어졌다는 의미.
prototyep이 헷갈리는 이유 : prototype을 자신을 만들어낸 객체원형(prototype link)으로 이해하는 것이 아닌 prototype property로 이해해서이다. prototype link와 prototype property는 다르다.
참고 : http://insanehong.kr/post/javascript-prototype/
사용 이유
자바스크립트는 prototype을 기반으로 상속을 구현한다. 생성자 함수(객체 만들어 내는 틀이라고 생각하자)와 new 키워드를 이용하여 인스턴스 객체를 만들어 낸다. 생성자 함수가 정의될 때, 생성자 함수의 프로토타입 객체도 동시에 생성된다. 프로토타입과 인스턴스 객체는 proto 프로퍼티를 가지고 있기 때문에 해당 프로퍼티를 통해 상위 프로토타입에 접근할 수 있다. 그리고 상위 프로토타입의 프로퍼티 및 메서드에 접근할 수 있다. 이러한 특징을 통해 중복된 코드 줄일 수 있고, 재사용성을 높일 수 있다.