년 전 마지막 날 반 에서 건어물 수출 을 좀 합 시다.class 에서 상속 에 대해 이야기 합 시다.

우 리 는 일상적인 개발 에 ES6 를 사용 합 니 다.예 를 들 어 우리 가 React 를 훑 고 구성 요 소 를 쓰 면 class XX extends React.Component.constructor(){super(xx)}와 같은 것 을 반드시 훑 었 을 것 입 니 다.오늘 이 클 라 스 를 살 펴 보 겠 습 니 다.JS 에 클 라 스 라 는 개념 이 없다 는 것 을 알 고 있 습 니 다.다른 언어,예 를 들 어 자바,python 은 천성적으로 클 라 스 가 있 습 니 다.JS 는 불복 할 것 입 니 다.그래서 ES6 에 클 라 스 를 도 입 했 습 니 다.그러면 클 라 스 는 정말 클 라 스 입 니까?No.이 class 는 다른 class 가 아 닙 니 다.사용 하 는 babel 의 친구 들 은 우리 가 컴 파일 된 es6 코드 를 열 면 실제 적 으로 es5 입 니 다.안에 class 가 없 는 지,아니면 prototype 이 있 는 지 알 게 될 것 입 니 다.말하자면 class 는 문법 사탕 일 뿐 입 니 다.우리 가 코드 를 개발 하 는 데 편리 할 뿐 입 니 다.좋아,그럼 진정한 계승 이 무엇 인지 보 자.Type 1:원형 체인 의 방식 으로 실현 할 수 있 습 니 다.talk is cheap,show me the code.밝 은 코드
  function Taylor () {
        this.name = 'Taylor'
        this.price = 7777
   }
  function Guitar () {
    this.dalao= '  '
  }

  Taylor.prototype = new Guitar()

  const guitar = new Taylor()

저 는 기 타 를 사고 싶 습 니 다.기 타 는 많은 브랜드 가 있 습 니 다.예 를 들 어 테일러 마 틴 야 마하 등 여러 가지 가 있 습 니 다.자세히 선택 한 다음 에 테일러 라 는 기타 브랜드 가 마음 에 들 었 습 니 다.먼저 테일러 라 고 정 의 했 습 니 다.그 다음 에 우 리 는 아버지 류 가 바로 기타 라 고 정 의 했 습 니 다.다음은 관건 적 인 단계 입 니 다.Taylor.prototype=new Guitar()는 Guitar 의 인 스 턴 스 를 Taylor 의 명시 적 프로 토 타 입 에 부여 하여 가장 기본 적 인 프로 토 타 입 체인 계승 을 완성 합 니 다.우 리 는 한번 해 볼 수 있 습 니 다.다시 콘 솔 에 상기 코드 를 입력 하고 실행 할 수 있 습 니 다.그 다음 에 4.567914.콘 솔 은 비 신 큰 사람 을 출력 합 니 다.Taylor 의 정의 에 dalao 의 속성 이 없 는데 지금 우 리 는 dalao 라 는 속성 을 출력 할 수 있 습 니 다.바로 원형 체인 을 통 해 찾 은 것 입 니 다.이것 은 Taylor 가 기 타 를 계승 했다 는 것 을 설명 합 니 다.또한 비 신 은 테일러 dalao 뿐만 아니 라어떤 브랜드 의 기타 든 지 다 라 오 는 내 가 요리 닭 을 기다 리 는 신 이다.자,본론 으로 들 어가 면 이러한 원형 체인 의 방식 도 단점 이 있 습 니 다.예 를 들 어 부모 류 의 속성 이 인용 유형 이 라면 하나의 하위 클래스 인 스 턴 스 에서 이 속성 을 수정 한 후에 새로 만 든 하위 클래스 인 스 턴 스 도 영구적 으로 수 정 됩 니 다.그리고 새로운 인 스 턴 스 대상 에 영향 을 줄 수 있 기 때문에 부모 구조 함수 에 직접 인삼 을 전달 할 수 없습니다.
Type 2:구조 함수 의 방식 으로 실현 할 수 있 습 니 다.talk is cheap,show me the code.밝 은 코드
 function Guitar (name) {
    this.dalao= name
    this.songs = []
  }
  function Taylor (dalao) {
    this.name = 'Taylor'
    this.price = 7777
    Guitar.call(this, dalao)
  }
  const guitar = new Taylor('  ')

위 와 마찬가지 로 우 리 는 구조 함수 의 방식 으로 계승 을 실현 합 니 다.관건 적 인 단 계 는 Guitar.call(this,'우신')입 니 다.아버지 류 Guitar 의 집행 문맥 this 지향 을 바 꾸 었 습 니 다.this 는 하위 클래스 를 가리 키 게 합 니 다.다시 말 하면 아버지 류 구조 함 수 를 하위 구조 함수 에서 한 번 실행 하 는 것 입 니 다.그리고 기 존의 원형 체인 계승 에 존재 하 는 문제점 을 해결 했다.하 나 는 바로 아버지 구조 함수 전 삼 을 직접 할 수 없다 는 것 이다.우 리 는 Guitar 에 게 형 삼 name 을 정 의 했 고 new Taylor('우 신')에서 우 리 는 우 신 이라는 실 삼 을 전달 했다.그리고 우 리 는 위 와 같이 콘 솔 에서 졌 다console.log(guitar.dalao)콘 솔 도 마찬가지 로 우 신 대 자 를 수출 한 다음 에 우 리 는 변경 을 할 수 있다.Guitar.call(this,'동생 60'),위의 절 차 를 반복 하면 콘 솔 에서'동생 60'을 출력 합 니 다.두 번 째 문 제 는 아버지 류 참조 유형 속성 입 니 다.저 는 songs=[]빈 배열 을 놓 았 습 니 다.그리고 우 리 는 기타 인 스 턴 스 의 songs 에 뭔 가 를 추가 합 니 다console.log(guitar.dalao)우리 연례 공연 곡 은 듣 기 좋 고 강력 추천 합 니 다.들 어 본 적 이 없 으 니 한번 들 어 보 세 요.그 다음 에 우 리 는 Taylor 의 인 스 턴 스 를 새로 만 들 었 습 니 다guitar.songs.push(' ')콘 솔 에서[]를 출력 했 습 니 다.그 전에 우리 의 조작 이 나중에 새로 만 든 인 스 턴 스 대상 에 영향 을 주지 않 았 다 는 것 을 알 게 되 었 습 니 다.이것 은 원형 체인 의 두 가지 단점 을 해 결 했 습 니 다.물론 구조 함수 모델 도 단점 이 있 습 니 다.즉,아버지 류 원형 에서 정 의 된 속성 자 류 는 계승 할 수 없습니다.그래서 우 리 는 정 수 를 취하 여 찌꺼기 를 제거 하고 두 가 지 를 하나 로 합 쳐 세 번 째 계승 방식 을 탄생 시 켰 다.조합 계승 은 바로 원형 체인 과 구조 함 수 를 조합 하여 계승 을 실현 하 는 것 이다.Type 3:조합 계승 방식 이 가능 합 니 다.talk is cheap,show me the code.밝 은 코드
  function Guitar (name) {
    this.dalao= name
    this.songs = []
  }

  function Taylor (dalao) {
    this.name = 'Taylor'
    this.price = 7777
    Guitar.call(this, dalao)
  }
Guitar.prototype.band = 'HikWestlife'

Taylor.prototype = new Guitar()
Taylor.prototype.constructor = Taylor

const guitar = new Taylor('  ')

이것 이 바로 조합 계승 입 니 다.동시에 우 리 는 Taylor.prototype.constructor 의 구조 기 를 Taylor 에 가 리 킵 니 다.그러나 완벽 하지 못 하 다.아버지 류 의 구조 함수 가 두 번 실 행 했 기 때문에 더 좋 은 성능 을 위해 우 리 는 최종 해방 방안,기생 조합 식 계승 을 발명 했다.
Type 4:기생 계승 방식 으로 실현 가능,talk is cheap,show me the code.밝 은 코드
  function Guitar (name) {
    this.dalao= name
    this.songs = []
  }

  function Taylor (dalao) {
    this.name = 'Taylor'
    this.price = 7777
    Guitar.call(this, dalao)
  }
Guitar.prototype.band = 'HikWestlife'

Taylor.prototype = Object.create(Guitar.prototype)
Taylor.prototype.constructor = Taylor

const guitar = new Taylor('  ')

함께 시험 해 보 자.우 리 는 콘 솔 에서 출력 한다const guitar222= new Taylor() console.log(guitar222.songs)'HikWestlife'를 출력 하 는 것 을 발견 했다.마찬가지 로 조합 계승 기능 을 실 현 했 고 구조 함수 도 한 번 만 실 행 했 을 뿐이다.자,이것 이 클 라 스 의 진면목 입 니 다.방학 입 니 다.설 을 쇠 다

좋은 웹페이지 즐겨찾기