SEB[JS 객체지향]

Section 1 HA 통과 후 Section 2의 시작은 JS 객체지향에 대해 학습을 시작했다. 객체지향이라고 하면 클래스를 떠올릴 수 있는데 나는 java를 배워왔던 터라 java와 비슷하게 생각을 했었다. 비슷한 부분도 많았지만 익숙하지 않은 부분도 존재했다. 이제 배운 것을 정리하고 느낀 점을 풀어보겠다.

객체 지향 프로그래밍(Object-Oriented Programming(OOP)) 은 절차 지향 프로그래밍과는 다르게 데이터와 기능을 묶어서 처리한다. 속성과 메소드는 하나의 객체라는 개념에 포함되며, 이를 클래스라고 한다.

Class를 이용한 모듈화

클래스와 인스턴스

• OOP : 하나의 모델이 되는 청사진(class) 을 만들고, 그 청사진을 바탕으로 한 객체(instance) 를 만드는 프로그래밍 패턴

• 클래스는 표지 사진과 같이 함수로 정의될 수 있으나, ES6에서는 class키워드를 이용해 정의한다.

• constructor는 생성자이며 인스턴스가 만들어질 때 실행되는 코드다. 생성자 함수는 return값을 만들지 않는다.

• 클래스는 new 키워드를 사용해 인스턴스를 생성한다.

  let pizza = new Meal('pizza');

속성과 메소드

• 클래스에 속성과 메소드를 정의하고, 인스턴스에서 이용한다. java처럼 이해를 한다면 속성은 필드가 될 것이고, 메소드는 java에서 그 메소드일 것이다.

• this 키워드는 인스턴스 객체를 의미한다. 자기 자신 인스턴스를 가리키는 것이다.

• 표지 사진에서와 같이 ES5에서는 prototype키워드를 사용해서 메소드를 정의해야 하지만 ES6에서는 그럴 필요가 없다.

프로토타입(Prototype)

객체 지향 프로그래밍

• 객체 지향 언어

  • 강의 자료에서는 객체 지향 언어를 이와 같이 표현했다.

    사람이 '세계를 보고 이해하는 방법'을 흉내낸 방법론

  • 클래스라고 부르는 데이터 모델의 청사진을 사용해 코드작성을 한다. 데이터와 기능이 묶여서 처리될 수 있게 됐다.

  • 현대의 언어는 대부분 객체지향의 특징을 갖는다. ex) java, C++, C# 등

  • javascript는 객체 지향 언어는 아니지만, 객체 지향 패턴으로 작성할 수 있다.

객체 지향 프로그래밍의 주요 개념 4가지

• Encapsulation (캡슐화) : 코드가 복잡하기 않게 만들고 재사용성을 높인다.
  • 데이터와 기능을 하나의 단위로 묶는 것
  • 정보 은닉(hiding) : 구현은 숨기고, 동작은 노출시킨다. 이는 내부 데이터나 내부 구현이 외부로 노출되지 않도록 만드는 것이다. 캡슐화는 이에 포커스가 맞춰져 있다.
  • 느슨한 결합에 유리하다. 이는 언제든 구현을 수정할 수 있음을 의미한다.

• Abstraction (추상화) : 코드가 복잡하기 않게 만들고, 단순화된 사용으로 인해 변화에 대한 영향을 최소화한다.
  • 내부 구현은 복잡하지만 실제로 노출되는 부분은 단순하게 만든다는 개념이다.
  • 추상화를 통해서 인터페이스가 단순해진다. 이는 클래스를 사용하는 사람이 불필요한 메소드 등을 노출시키지 않고, 단순한 이름으로 정의하는 것에 포커스가 맞춰져 있다.
  • 인터페이스 : 클래스 정의 시, 메소드와 속성만을 정의한 것. 이것이 추상화의 본질이다.

• Inheritance (상속) : 불필요한 코드를 줄여 재사용성을 높인다.
  • 부모 클래스(기본 클래스)의 특징을 자식 클래스(파생 클래스)가 물려(상속)받는 것이다.

• Polymorphism (다형성) : 동일한 메소드에 대해 조건문 대신 객체의 특성에 맞게 달리 작성하는 것이 가능해진다.
  • 다양한 형태를 가질 수 있는 것을 의미하는데, 똑같은 메소드라 하더라고 다른 방식으로 구현될 수 있음을 말한다.

프로토타입 체인

• MDN 참조를 통해서 프로토타입 체인에 대해서 알 수 있다.

• 상속을 JS에서 구현할 때에는 프로토타입 체인을 사용한다.

• extends와 super를 이용해서 상속을 구현할 수 있다.

  class Person {
  	constructor() {
  		this.name = 'jogi';
  		this.age = 3;	
  	}
  }
  class Student extends Person {
  	constructor() {
  		super();   // name은 'jogi'가 되며, age는 3이 된다.
          	this.grade = 'A';
      	}
  }

실습과 느낀점

실습은 페어프로그래밍으로 진행이 됐으며, 클래스의 상속을 주로 다루어 문제를 해결하는 것이었다. java를 하면서도 super를 잘 이용하지 않아서인지 금방 해결하긴 했지만, 상속을 제대로 사용하는 것에 애를 먹었던 것 같다. 그리고 JS에서는 java와 달랐던 것이 생성자를 constructor라는 키워드를 이용해서 만들어줬다는 것이다. 그리고 메소드를 만드는 방법에도 차이가 있었다. 그래도 틀은 비슷했던지라 잘 해결할 수 있었다. 그리고 알 수 있었던 것은 부모에게 상속받은 속성이나 메소드를 사용하고 싶다면 extends를 이용해 상속을 받고, 클래스 내부에서는 super키워드를 사용해서 접근해야 함을 알 수가 있었다. 무조건 super를 사용해야 상속받은 것을 사용할 수 있다는 것을 기억하자. 어렵지는 않은 개념이었으나 제대로 알고, 객체 지향 프로그래밍의 장점을 더욱 살릴 수 있는 프로그래밍을 해야할 것 같다. 이번 Section도 힘내보자!!

Reference

• 코드스테이츠 강의 자료