자바스크립트 객체 지향(Object-Oriented Programming)에 대한 기초 지식

자바스크립트는 객체 지향(Object-Oriented Programming) 언어지만,

다른 언어들과 조금 다르다.

 

C++, JAVA : class 기반 언어

Javascript : prototype 기반 언어 

 

객체(Object): 일종의 데이터 타입이다.

"어떤 것"이라고도 할 수 있다.

여러 속성을 하나의 객체에 담아서,

key와 value값을 저장할 수 있다.

 

축구선수 박지성을 하나의 객체로 잡았을 때,

다음과 같은 정보를 구분해볼 수 있다.

 

속성(Property): 이름, 나이, 키..

객체의 메소드(Method): 대상의 동작

 

반응형

 

- 객체(Object)를 코드로 표현해본 방법

객체의 또 다른 말은 인스턴스(instance)

 

클래스(class)는 일종의 붕어빵 틀로,

클래스를 쓰면 객체(Object)들을 찍어낼 수 있다.

 

ex)

축구 선수라는 class가 있다면, 
박지성 외에도 손흥민과 같은 객체(object)들을 쉽게 만들 수 있다.

 

자바스크립트에서는 암묵적으로, 
함수가 대문자로 시작하고 Camel case 형태일 때,
객체 선언으로 본다.

- 객체 : 함수의 첫 글자가 대문자로 시작
- 일반 함수 : 첫 글자가 소문자로 시작

사실 Class 개념은 자바스크립트에 없는 개념이다.
다른 언어들과 달리, 자바스크립트 객체지향 개념은
차이가 조금 있다.

자바스크립트의 모든 개념은 객체를 기반으로 하며,
Prototype이라는 독특한 개념이 존재한다.

다른 언어에서는 
"손흥민이라는 새로운 객체를 축구 선수라는 클래스를 이용해서 만든다."

반면에 자스에서는
"축구 선수라는 객체를 프로토타입으로 삼아, (객체 재사용)
손흥민이라는 새로운 객체를 생성한다."

 

캡슐화 

(= 정보 은닉)

1. 객체가 데이터를 속성에 저장
2. 저장한 데이터로 기능을 수행하는 메소드를 포함시키기

ex) 스마트폰이 하나의 객체(Object)라면?

스마트폰의 사용자 인터페이스에는 
버튼, 터치스크린, 음성 등의 기능이 있다.
그러나 유저들은 스마트폰이 내부적으로 어떻게 동작하는지 모르는 상태로,
스마트폰을 쓴다.

인터페이스에서 원하는 기능을 수행하기만 한다면,
내부적으로 어떻게 구현되어 있는지 몰라도 상관없어 한다.

보통 스마트폰의 설계가 어떻게 되었는지, 
안에서 어떻게 구현이 되었는지의
정보는 숨겨져 있다.

 

프로그래머들도 라이브러리를 갖다 쓸 때
그 안의 메소드를 다 뜯어보지 않는다.

 

타 언어에서는 public, private, protected를 사용해서,

특정 메소드와 속성의

접근 권한을 컨트롤한다.

 

자바스크립트에서도 물론 데이터를 보호하기 위한

방안이 존재한다.

https://www.pagerduty.com/resources/learn/what-is-data-aggregation/

객체 지향에서는 
여러 객체를 하나의 새로운 것으로 구성하기 위해
집합(Aggregation) 혹은 구성(Composition) 개념을 쓴다.

해결하기 어려운 큰 덩어리를 개발자가 
쉽게 다룰 수 있도록 쪼개서 해결할 수 있도록 돕는다.

https://media.vlpt.us/post-images/cyranocoding/6c8e33a0-b22a-11e9-a4ce-730fc6b3757a/oop.png

추상화란, 컴퓨터 시스템에서 문제를 다룰 때 
복잡한 것들을 효율적으로 설계할 수 있도록 돕는 방법이다.

개발할 내용들을 몇 가지 계층으로 추상화시킨다면
훨씬 더 해결하기가 쉬워진다.

집을 지을 때, 바닥부터 시작해서 기둥, 문, 지붕 등의 
component를 나눠서 조립하는 것과 같다.

각각의 객체를 합쳐서 단일 객체로 만들면,
그것이 바로 집합이다.

 

상속

코드를 재사용하기 위한 방법인데,

객체 지향(OOP) 프로그래밍에서는 상속을 잘 쓴다.

 

우리가 이미 '인간'이라는 class를 가지고 있다고 해보자.

우리는 '인간'의 속성과 메소드를 가져다가,

'축구선수'라는 class에도 쓸 수 있다.

 

'공통적인 부분은 최대한 상속해서 쓰자'가 모토이다.

자식 클래스가 부모 클래스를 상속받아서 

속성과 메소드를 가져다가 쓴다.

 

 

※ 자바스크립트는 class 대신 

prototype으로 상속을 구현한다.

 

"SoccerPlayer가 생성됨과 동시에
Man에게서 속성과 메소드를 상속받았다."

 

오버라이딩(Overriding): 

상속받은 부모의 메소드 중 하나를 새롭게 정의한다.

 

생성자 함수

Javascript에서 객체를 생성시에
처음으로 호출되는 함수

객체를 새롭게 만듦과 동시에, 
초깃값을 함께 전달하여 생성할 수 있다.

 

code 분석

1. name: 속성 추가

2. (name, position) : 함수의 인자로서 추가 
→ 입력시 스스로의 속성값이 됨

3. function() 2개 : 메소드 추가 (이름과 포지션 확인)

 

constructor 속성으로,

player객체를 만들 때, 어떤 객체를 참조했는지 알 수 있다.

 

instanceof로,

객체 생성시 어떤 생성자를 참조했는지 알 수 있다.

 

자바스크립트 객체지향형 문법에서는

기능을 '객체'로 구현해놓고 쓸 수 있게 만들어 놓았다.

 

내장형 객체를 이용하면, javascript측에서 

미리 만들어놓은 기능을 편리하게 쓸 수 있다.

 

 

 

 

출처: 구름 EDU, node.js 강의