Javascript _ 객체 지향 프로그래밍

이승미·2022년 5월 26일
0

1. 객체지향 프로그래밍이란?

프로그래밍 접근법
절차 지향 프로그래밍(PP)기능에 초점을 둠어떤 순서로 처리하는가?데이터를 중심으로 함수 만듦
객체 지향 프로그래밍(OOP)객체에 초점을 둠누가 어떤 일을 할 것인가?데이터와 기능을 묶어서 처리

절차 지향 프로그래밍 (Procedure Programming)
절차 지향 프로그래밍이란 기능을 중심을 두고 '어떤 순서로 처리할 것인가?'에 초점을 둔다.
따라서 필요한 데이터의 순서를 파악하고 그에 필요한 기능을 함수로 만든다.

객체 지향 프로그래밍 (Object Oriented Programming)
객체 지향 프로그래밍이란 객체를 중심으로 두고 '누가 어떤 일을 할 것인가?'에 초점을 둔다.
따라서 각각의 객체를 생성하고 객체마다 데이터와 기능을 한 곳에 묶어준다.
현재는 객체 지향 프로그래밍이 절차 지향 프로그래밍 보다 더 많이 사용된다.


2. OOP의 특징

'객체 지향 프로그래밍' 이라고 쓰는 것은 번거로우므로 대신에 OOP라는 용어를 사용해보겠다.
OOP의 경우 캡슐화, 추상화, 상속, 다형성 이라는 4가지의 특징이 존재한다.

1. 캡슐화

캡슐화는 데이터(속성)와 기능(메서드)을 한 객체 안에 넣어서 묶는 것이다.

속성과 메서드는 한 객체 안에서 묶이며 느슨하게 결합이 되는데, 이 느슨한 결합이란, 코드 실행 순서에 따라 절차적으로 코드를 작성하는 것이 아니라 코드가 상징하는 실제 모습과 닮게 코드를 모아 결합하는 것이다.
이를 통해 코드만 보고도 인스턴스 객체의 기능을 상상할 수 있다.

캡슐화의 중요한 특징은 은닉이다. 은닉화는 내부의 속성이나 메서드를 외부로 노출되지 않도록 감추는 것이다.

은닉은 외부에 공개될 필요가 없는 내부의 일부를 감추어 적절치 못한 접근으로부터 정보를 보호해주고, 객체 내부 메서드의 구현을 수정했을 경우 외부에 노출된 메서드를 사용하는 코드 흐름을 바뀌지 않게 해준다는 효과가 있다.

은닉에서는 객체 외부의 동작에 필요한 메서드만 일부 공개한다.

2. 추상화

추상화는 내부 구현이 복잡할 때에도 외부의 실체로 노출되는 부분은 필요한 속성만 간추려내어 단순하게 만드는 것이다.

추상화를 통해 인터페이스(메서드와 속성의 정의)를 필요한 속성만 간추려내어 단순하게 만들었기 때문에 예기치 못한 사용상의 변화가 일어날 일이 줄어들게 된다.

3. 상속

상속은 어떤 클래스의 속성이나 메서드를 다른 클래스가 상속받아 그대로 사용할 수 있는 것을 말한다. 쉽게 말해 부모 클래스의 특징을 자식 클래스가 물려 받는 것이다. OOP의 특징 중 가장 중요하다.

예를 들어, 사람 클래스가 이미 존재하는 상황에서 학생 클래스를 작성해야 할 때, 상속을 이용해 사람 클래스를 상속받고 그 이외의 ‘학생’ 으로서의 속성이나 메서드를 추가하는 것이다.

이렇게 상속을 통해 불필요한 중복을 제거할 수 있다. 이는 개발 비용을 현저히 줄일 수 있는 잠재력이 있으므로 매우 중요하다.

4. 다형성

다형성은 똑같은 메서드를 가진 객체라 하더라도 다른 방식으로 구현될 수 있다는 것을 말한다.

예를 들어, TextBox, Select, CheckBox 엘리먼트가 내부적으로 모양을 그리고 화면에 뿌리는 메서드인 render를 상속받았을 때, render 메서드는 엘리먼트 별로 조금씩 다르게 작동한다. (TextBox는 직사각형의 상자와 커서, Select는 박스 눌렀을 때 선택지 나오는 등)

만일, 다형성 특징이 없다면 부모 클래스에서 종류별로 분기를 나누어 하나하나 다 다르게 만들어야 해서 매우 번거로웠을 것이다.


3. OOP 기초 _ 클래스와 인스턴스

객체 지향 프로그래밍은 모델이 되는 하나의 청사진(설계도)을 먼저 만들고 그것을 바탕으로 객체를 만드는 프로그래밍 방법이다.
자동차로 예시를 들어보면, 청사진은 모든 자동차에 필수로 들어가는 요소인 핸들, 타이어, 좌석 등에 해당한다. 그리고 이 청사진을 바탕으로 만들어지는 각각의 객체는 벤츠, 람보르기니, 페라리 등의 특정 자동차 모델들에 해당한다.

이미 자바스크립트에는 객체 지향 프로그래밍과 무관하게 '객체' 라는 개념이 존재한다. 그러므로 이와 구별하기 위해서 청사진은 '클래스' 라고 부르고, 청사진을 바탕으로 만들어지는 객체는 '인스턴스' 라고 부른다.

1. 클래스

클래스를 만들 때는 일반적인 다른 함수와 구별하기 위해서 보통 대문자로 시작해 일반 명사로 만든다.
클래스를 만드는 방법은 ES5 방법, ES6 방법 두 가지가 있다.

<ES5 방법>

클래스를 생성자 함수로 정의한다.

//ES5 방법
function Car (brand, name, color) {
  //인스턴스 만들 때 실행되는 코드들
  this.brand = brand;   //this 키워드를 사용
  this.name = name;
  this,color = color;
  //생성자 함수는 리턴값을 만들지 않는다
}

Car.prototype.drive = function() {  //메서드 만들 때
  console.log(`${this.name}가 운전을 시작합니다`);
}

<ES6 방법>

class 키워드를 사용하여 정의하며, 생성자(constructor) 함수가 추가된다. 최근에는 ES6 방법이 보다 더 많이 사용된다.

//ES6 방법
class Car {
  constructor (brand, name, color) {
    //인스턴스 만들 때 실행되는 코드들
    this.brand = brand;   //this 키워드를 사용
    this.name = name;
    this,color = color;
    //생성자 함수는 리턴값을 만들지 않는다
  }
  drive() {
    console.log(`${this.name}가 운전을 시작합니다`); // 메서드 만들 때
}

인스턴스

인스턴스를 만들 때는 new 키워드를 사용해서 만든다. new 키워드를 사용함으로써 즉시 생성자 함수가 실행되며 변수에 클래스의 설계를 가진 새로운 객체, 인스턴스가 할당된다. 각각의 인스턴스는 클래스의 고유한 속성과 메서드를 갖게 된다.

// 인스턴스 만들 때는 new 키워드를 사용하여 만든다. 
let avente = new Car('hyundai', 'avante', 'blue');
let beetles = new Car('volkswagen', 'beetles', 'red');

0개의 댓글