• 티스토리 홈
  • 프로필사진
    alpha brain
  • 방명록
  • 공지사항
  • 태그
  • 블로그 관리
  • 글 작성
alpha brain
  • 프로필사진
    alpha brain
    • 분류 전체보기 (93)
      • SOFTWARE DEVELOP (68)
        • REACT.JS (3)
        • WEBPACK (4)
        • HTML&CSS (2)
        • EXPRESS (0)
        • DATABASE (0)
        • NODE.JS (3)
        • JAVASCRIPT (24)
        • DOCKER (1)
        • Linux (3)
        • Git (6)
        • GRAPHQL (0)
        • Datastructure (7)
        • Development (6)
        • HTTP (1)
        • Programming Paradigm (1)
        • Algorithm log (5)
        • DEV log (1)
        • Project log (0)
        • I don't know yet (1)
      • 경제, 재무 (23)
      • 여행 (0)
      • 시사, 상식 (2)
  • 반응형
    250x250
  • 방문자 수
    • 전체:
    • 오늘:
    • 어제:
  • 최근 댓글
      등록된 댓글이 없습니다.
    • 최근 공지
        등록된 공지가 없습니다.
      # Home
      # 공지사항
      #
      # 태그
      # 검색결과
      # 방명록
      • [Javascript] class inheritance in ES6
        2020년 02월 14일
        • alpha brain
        • 작성자
        • 2020.02.14.:34
        728x90
        반응형

        앞에서는 object.create( ),  prototype.constructor 를 이용해서 상속을 구현했다면 ES6 에서는 이 방법을 좀더 쉽고 간결하게 쓸수있도록 새로운 문법을 만들었다.

        class Person {
          constructor(name){
            this.name = name;
          }
          eat(){
            // do something
          }
        }
        
        class Employee extends Person {
          constructor(name){
            super(name)
          }
          work(){
            // do something
          }
        }

        엄청나게 간결해졌다.

        extends 키워드를 사용해서 어떤 클래스를 상속할지 적어준다(매우매우 직관적이다.)

        Employee class에서 constructor 함수를 보면 name을 받고 있는데, 인스턴스 생성시 인자로 넣어주면된다.

        super keyword로 받은 name을 념겨주면 상위 class에서의 constructor함수의 인자로 들어가게 된다. (즉, 상위 class의 property를 사용할수 있다. 이전에서 사용하려면 call, apply를 사용하던것과 비교하면 굉장히 간편해졌다.)

        코드를 실행해보면,

        Object.create() 로 만들었던 부분과, constructor부분까지 모든것이 다 깔끔하게 정리되었다.

        728x90
        반응형

        'SOFTWARE DEVELOP > JAVASCRIPT' 카테고리의 다른 글

        [Javascript] Pseudoclassical Subclass Instantiation  (0) 2020.02.23
        [Jacascript] call, apply, bind and this  (0) 2020.02.21
        [Javascript] Object.create( ) 과 prototype chaining  (0) 2020.02.14
        [Javascript] prototype, __proto__, constructor  (0) 2020.02.14
        [Javascript] callBack은 call me back  (0) 2020.01.26
        다음글
        다음 글이 없습니다.
        이전글
        이전 글이 없습니다.
        댓글
      조회된 결과가 없습니다.
      스킨 업데이트 안내
      현재 이용하고 계신 스킨의 버전보다 더 높은 최신 버전이 감지 되었습니다. 최신버전 스킨 파일을 다운로드 받을 수 있는 페이지로 이동하시겠습니까?
      ("아니오" 를 선택할 시 30일 동안 최신 버전이 감지되어도 모달 창이 표시되지 않습니다.)
      목차
      표시할 목차가 없습니다.
        • 안녕하세요
        • 감사해요
        • 잘있어요

        티스토리툴바