4 minute read

  • 클래스와 기본 문법

    • 클래스

      • OOP에서 특정 객체를 생성하기 위해 변수와 메소드를 정의하는 일종의 틀.

      • 객체를 정의하기 위한 상태(멤버 변수), 메서드(함수)로 구성

      • class 문법으로 생성

      • 함수의 한 종류

      • 정의한 메서드는 prototype에 저장됨

      • 함수처럼 표현식 내부에서 정의, 전달, 반환, 할당 가능하며 기명 함수 표현식 또한 사용 가능

      • 접근자 프로퍼티(getter, setter), 계산된 프로퍼티 사용 가능

      • constructor()

        • 객체 기본 상태를 설정해주는 메서드

        • new 로 생성 시 자동으로 호출됨

        • 함수 본문이 됨

      • 클래스 필드

        • 클래스의 프로퍼티

        • 어떤 값이든 가능

        • prototype이 아닌 클래스와 개별 객체에 지정됨

        • 생성자가 역할 다 한 이후 처리됨

        • 복잡한 표현식이나 함수 호출 결과 사용 가능

      • 생성자 함수와의 차이점

        • 특수 내부 프로퍼티인 [[FuntionKind]]: “classConstructor” 가 이름표 처럼 붙어서 new 와 함께 호출하지 않으면 에러 발생(JS 엔진이 확인)

        • 문자열로 변환될 시 class로 시작하는 문자열 표현4

        • 메서드(prototype 프로퍼티에 추가된) 전체의 enumerable 플래그는 false 값.(순회할 수 없음)

        • 항상 엄격모드로 실행됨

      • 화살표 함수

        • 독립된 함수 만들고 this를 해당 객체에 바인딩 가능
  • 클래스 상속

    • 클래스가 다른 클래스를 상속 받는 기능

    • 자녀 클래스의 프로토타입이 부모 클래스의 프로토타입을 상속 받으므로 메서드 전체가 상속됨

    • extends

      • 생성자 함수로써 프로토타입 기반으로 동작함

      • 클래스의 프로토타입과 클래스 자체를 동시에 상속받게 함

    • super키워드

      • 부모 클래스에 정의된 메서드를 호출하거나 부모 생성자를 호출하는데 사용됨

      • 부모 생성자 호출은 자식 생성자 내부에서만 사용 가능

      • 화살표 함수는 지원하지 않으며 super접근 시 외부 함수에서 가져옴

      • this 만으로는 무한 루프에 빠지기 때문에 나옴

      • [[HomeObject]]

        • 함수 전용 특수 내부 프로퍼티

        • 클래스이거나 객체 메서드인 함수에서 해당 객체 저장함

        • 개발자가 변경할 수 없음

        • 함수 자유도 파괴할 수 있음

        • super 내부에서만 유효

        • super 가 참조해서 부모 프로토타입과 메서드 찾음

        • 객체 메서드에서는 method() 형태로 정의해야 함 (할당 시 작동 안 됨)

    • 메서드 오버라이딩

      • super.method()로 부모에서 정의된 메서드 사용

      • 상속 메서드를 자체 메서드로 덮어쓰기 가능

    • 생성자 오버라이딩

      • 기본적으로 부모 consturctor 호출하고 부모 constructor 에도 인수 모두 전달함

      • super()

        • 상속 클래스의 생성자에는 반드시 호출

        • 일반 클래스의 생성자 함수는 new와 함께 실행 시 생성자 함수는 빈 객체 만들고 this에 이 객체를 할당함

        • 상속 클래스는 객체 만드는 과정을 부모 클래스의 생성자가 처리해주길 기대함

    • 클래스 필드 오버라이딩

      • 필드 초기화

        • 부모 클래스가 없을 시 생성자 실행 이전에 초기화

        • 부모 클래스 있을 시 super() 실행해서 부모 생성자 호출 직 후 초기화

        • 초기화 순서 고려하며 오버라이딩

        • 문제 발생 시 getter나 setter 사용

  • 정적 메서드와 정적 프로퍼티

    • 클래스 ‘전체’에 필요한 기능 만들 때 사용

    • extends 로 상속 시 자녀 클래스 함수가 부모 클래스 함수를 상속되므로 정적 메서드/프로퍼티 상속됨

    • static 키워드 붙음

    • 정적 메서드

      • 클래스 함수 자체의 메서드

      • 메서드를 프로퍼티 형태로 직접 할당하는 것과 동일한 역할

      • 어떤 특정한 인스턴스가 아닌 클래스에 속한 함수 구현하고자 할 때 유용(비교 함수, ‘팩토리’ 메서드(다양한 방법 사용해 조건에 맞는 인스턴스 생성))

    • 정적 프로퍼티

      • 클래스 함수 자체의 프로퍼티

      • 프로퍼티를 직접 할당한 것과 동일하게 작동

  • private, protected 프로퍼티와 메서드

    • 캡슐화

      • OPP에서 내/외부 인터페이스 구분할 때 사용하는 용어

      • 이점

        • 사용자 보호 : 사용자가 자신의 발등을 찍지 않도록 보호, 즉 클래스 내부를 건드려서 에러가 일어나는 일 방지

        • 자유성 보장 : 내/외부 엄격히 구분 시 자유롭게 내부 프로퍼티와 메서드 수정 가능함 (외부에서 내부 프로퍼티에 대해 의존성 없어짐)

        • 복잡성 은닉 : 구현 세부 사항이 숨겨져 있으면 간단하고 편리해짐

    • public

      • 어디서든 접근할 수 있는 프로퍼티이며 외부 인터페이스 구성

      • 일반적으로 다룬 프로퍼티와 메서드

    • private

      • 클래스 자신에서만 접근이 가능한 프로퍼티

      • 상속 받는 클래스에서 접근 불가

      • #로 시작됨

      • 정식으로 등재된 문법(스펙에 추가된지 얼마 안 됨)이므로 언어 자체에서 강제함

      • public 필드와 상충하지 않으며 getter, setter 이용해서 접근

      • this[name]으로 접근 불가능

    • protected

      • 클래스 자신과 자식 클래스에서만 접근이 가능한 프로퍼티 (상속 떄문에 private보다 자주 쓰임)

      • 정식으로 지원하는 문법 아님

      • _로 시작 (관습처럼 사용)

      • getter, setter 로 통제

      • 상속됨

    • 읽기 전용 프로퍼티

      • 프로퍼티 생성할 때만 값 할당하고 그 이후 값이 수정되지 않는 프로퍼티

      • setter 만들 지 않고 getter만 설정

      • set…/get… 형식의 함수로도 대체 가능

  • 내장 클래스 확장

    • 내장 클래스의 기능을 확장

    • extends 로 상속 시 내장 클래스의 메서드를 상속받은 클래스의 인스턴스 반환

    • 자식 클래스 내부에서 constructor 기반으로 새로운 객체 생성 및 반환

    • symbol.specied

      • 내장 메서드(map, filter) 등의 메서드 호출 시 만들어지는 개체의 생성자 지정
    • 정적 메서드 상속

      • 일반적인 클래스

        • 정적 메서드(함수의 프로퍼티인 메서드)와 그렇지 않은 메서드 모두 상속 받음
      • 내장 클레스

        • 클래스 자체 끼리 상속 못 받아서 자체 정적 메서드 상속받지 못 하고 prototype 끼리만 상속 받음
  • instanceof, isPrototypeof로 클래스 확인

    • instanceof

      • 대상 obj 가 해당 클래스의 인스턴스인지, 클래스 상속받는 클래스 속하는지 확인하고 true/false 반환

      • 인스턴스

        • 프로토타입 체인 올라가며 인스턴스/상속 여부 파악
      • 생성자 함수

      • 계층 구조 가진 클래스 다룰 때나 클래스 상속 여부 확인

      • symbol.hasInstance

        • instanceof 로직 설정

        • 호출 결과는 Boolean 형식

        • 클래스에 정적 메서드로 구현돼있으면 instanceof 문 실행될 떄 해당 메서드 호출

        • 클래스에 정적 메서드로 없으면 프로토타입 체인 올라가며 비교 클래스(Class.prototype)의 프로토타입이 대상 객체(obj)의 프로토타입 체인 상의 하나인지 비교 후 true/false 반환

    • isPrototypeOf

      • Class 생성자끼리의 프로토타입 제외하고 프로토타입 체인과 Class.prototype 만 고려
    • 이외 메서드

      • typeof

        • 동작 대상은 원시형

        • 반환값은 문자열

      • {}.toString

        • 동작 대상은 원시형, 내장 객체, Symbol.toStringTag가 있는 객체

        • 반환값은 문자열

  • 믹스인

    • 믹스인

      • OPP에서 범용적을 쓰이는 언어

      • 다른 클래스들의 메서드 조합을 포함하는 클래스를 의미

    • JS

      • 다중 상속 지원하지 않음

      • 메서드 복하새 프로토타입에 붙여넣음으로써 믹스인 구현 가능

      • 이벤트 핸들링 등 의 행동 추가하여 클래스 확장하는 용도로 사용 가능

      • 실수로 기존 클래스 메서드 덮어쓸 시 충돌 발생 가능하므로 이름 신중히 설정

    • Object.assing(Class.prototype, obj)

      • obj에 있는 메서드를 복사해 클래스의 프로토타입에 붙여넣음으로써 믹스인 구현 가능

      • [[HomeObject]] 로 부모 메서드의 Class 남으므로 상속된 객체도 부모 객체 메서드 사용

Categories: ,

Updated: