OOP (Object Oriented Programming), concept, prototype

프로그래밍 언어 3

• Machine Languages
• Assembly Languages 
• HighLevel Languages ( 인간의 언어와 가까움, JavaScript)

Machine Languages

• 0,1로만 조합
• 사람이 Machine Language로 프로그래밍을 하기는 어려움

Assembly Languages

• and 나 or 처럼 미리 저장되어 있는 기능들이 몇 개 있다.
• 컴퓨터가 프로세스하려면 machine language로 변환해야 한다.

High-Level Languages

• 어셈블리어로 미리 함수를 만들어 놓고 그 함수를 사용할 수 있게 만든 언어
• C : 현재에서 보면 어셈블리어에 가까움

 

 

• java, C는 컴파일을 하지만 JavaScript는 하지 않음
• java나 C는 컴파일을 거쳐서 어셈블리어로 바뀌고
• 어셈블리어는 CPU를 통해 기계어로 바뀌게 된다. 

 

 

 

 

 

 

 

 

 

 

 

2 - HL Languages (High-Level Languages)

역사적으로 HL language는 두 가지로 구분할 수 있다.

 

 

• Procedural languages (절차지향적 언어)
  • 순차적으로 진행해서 특정 기능을 하도록 만들어졌다.
  • C, COBOL, Parl etc.
• Object-Oriented languages(OOP) (객체지향적 언어) 
  • 모든 요소들이 Object로 구성되어 있다.
  • Java, C++, C#, Python, PHP, JavaScript etc.

 

---

OOP 객체지향적 언어

• 모든 것은 객체로 되어 있다.
• 재사용성이 높다.
• 사람이 세계를 보고 이해하는 방법을 흉내낸 방법론이다.

 

- class

• 객체를 생성하는 데 있어서 청사진이자 prototype이다.
• 객체는 class의 instance 이다.
• class가 가지고 있는 constructor에서 그 specification을 정의할 수 있다.

 

 

- OOP 기본 컨셉 4가지

• Encapsulation
• Inheritance
• Abstraction
• Polymorphism

 

1. Encapsulation

 

 

• 노란색 박스: 절차지향적으로 한 사원의 임금을 구한 예

 

 

• 초록색 박스: 객체지향적인 예
  • 속성들을 마치 캡슐처럼 constructor 안에 정의해 두었다.

 

 

 

 

 

 

 

2. Inheritance

부모의 특징을 물려 받는다.

DOM을 예로 들면,

• HTML Div Element는 부모인 HTML Element로부터 상속한다.
• 즉, 부모의 속성, 메소드들을 그대로 가지게 된다.

 

 

 

3. Abstraction

내부는 굉장히 복잡하게 구성되어 있지만 사용자가 이를 알 필요가 없도록 간단하게 사용할 수 있도록 '추상화'되어 있다.

사용자 등 누군가로부터 변경 사항이 생기는 것을 방지할 수 있다.

즉, 인터페이스가 간단하다.

 

 

 

4. Polymorphism

poly(many) + morphe(form) : 다양한 형태

polymorphism 이라는 개념을 통해

 

• textbox, select, checkbox가 각자 정의된 render()를 갖지 않고 HTMLElement의 render()를 상속해서 사용할 수 있다.

 

 

 

 

 

 

Encapsulation	복잡도를 줄여준다. 재사용성을 높여준다.
Inheritance	똑같은 코드가 겹치지 않게 한다.
Abstraction	복잡도를 줄여준다. 내부가 변경될 위험으로부터 자유롭다.
Polymorphism	switch / case 와 같은 문구를 쓰지 않고 깨끗하게 쓸 수 있게 해 준다.

 

---

JavaScript는 프로토타입 기반 언어(prototype-based language)

 

• 모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미이다.
• 프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수도 있고 그 상위 프로토타입 객체도 마찬가지이다. 이를 프로토타입 체인(prototype chain)이라 부른다.
• prototype chain은 다른 객체에 정의된 메소드와 속성을 한 객체에서 사용할 수 있도록 하는 근간이다.
• 상속되는 속성과 메소드들은 각 객체가 아니라 객체의 constructor의 prototype이라는 속성에 정의되어 있다.
  • 상속을 받을 때에는 Object.prototype.으로 시작하는 것들만 상속 받고 Object.keys와 같이 Object. 로 시작하는 것들은 Object() 생성자에서만 사용할 수 있다.

• 많은 수의 모던 브라우저들이  __proto__ (앞뒤로 언더바 2개씩) 속성을 통해 특정 객체의 프로토타입 객체에 접근할 수 있도록 구현했다.

 

 

 

 

prototype

: assignable

 

instantiation : 인스턴스를 생성하는 과정

 

__proto__

: prototype chain

 

콘솔에 steve.__proto__ 를 입력하면 constructor가 담긴 객체가 나온다.

 

즉, steve.__proto__ === Human.prototype  // true

 

 

 

 

 

 

 

 

Advanced

OOP in javascript