JS의 상속 이해

js의 프로토타입 상속

프로토타입 체인은 js 상속을 구현하는 주요 방법입니다. 그 원칙은 프로토타입을 사용하여 하나의 참조 유형이 다른 참조 유형의 속성과 메서드를 상속하도록 하는 것입니다. 프로토타입 객체를 인스턴스와 동일하게 만들면 이때 프로토타입 객체에는 다른 프로토타입에 대한 포인터가 포함됩니다. 다른 프로토타입이 객체의 인스턴스와 동일하다면 이것이 프로토타입 체인의 기본 개념입니다.

다음은 간단한 예입니다

    var Parent = function(){
        this.name = 'parent' ;
    } ;
    Parent.prototype.getName = function(){
        return this.name ;
    } ;
    Parent.prototype.obj = {a : 1} ;    var Child = function(){
        this.name = 'child' ;
    } ;
    Child.prototype = new Parent() ;    var parent = new Parent() ;    var child = new Child() ;
    console.log(parent.getName()) ; //parent
    console.log(child.getName()) ; //child

위 코드는 부모와 자식의 두 가지 유형을 정의합니다. 각 유형에는 속성과 메소드가 있습니다. 상속은 상위 인스턴스를 생성하고 이 인스턴스를 child.prototype에 할당하여 구현된다는 것입니다. 그는 새로운 사례입니다. 상위 클래스의 객체를 하위 클래스 생성자의 프로토타입에 직접 할당하여 하위 클래스의 객체가 상위 클래스의 프로토타입과 상위 클래스 생성자의 속성에 접근할 수 있도록 합니다.
instanceof 연산자를 사용하여 프로토타입 체인에 나타나는 인스턴스와 생성자를 테스트하면 true를 반환할 수 있습니다.

---

생성자 빌리기

생성자는 무엇입니까?

생성자 JavaScript는 클래스가 아닙니다. 특정 메서드가 존재합니다. 일반 함수를 사용하여 개체 클래스를 만드는 경우 이를 생성자 또는 생성자라고 합니다. 함수가 실제 생성자로 작동하려면 다음 조건을 충족해야 합니다.

1. 일반적으로 속성과 메서드를 추가하여 함수 내부에 새 개체(this)의 속성을 설정합니다.

2. 생성자는 return 문을 포함할 수 있지만(권장되지 않음) 반환 값은 this 또는 기타 비객체 유형 값이어야 합니다.

JavaScript 생성자에 대해 쉽게 혼동되는 영역 중 하나는 프로토타입의 생성자 속성입니다. JavaScript에서 각 함수에는 기본 프로토타입 객체 속성 프로토타입이 있으며, 여기에는 기본적으로 생성자와
proto라는 두 가지 멤버 속성이 포함됩니다. 프로토타입의 세부 사항은 이 기사에서 논의되지 않습니다. 지금 우리가 걱정하는 것은 생성자 속성입니다.

습관적인 객체 지향 사고에 따르면 생성자는 "클래스"의 정의와 동일하므로 생성자 속성이 클래스의 실제 생성자라고 생각할 수 있습니다. 객체를 초기화하기 위해 생성자를 직접 호출하는 것은 큰 실수입니다. 위에서 새로운 표현식 실행의 실제 프로세스를 소개했습니다(4단계). 그 중 세 번째 단계는 객체를 초기화하는 데 사용됩니다. 호출되는 초기화 함수는 빌린 생성자가 아닌 "클래스 함수" 자체입니다

    function CO(){
    this.p = “I’m in constructed object”;    this.alertP = function(){
        alert(this.p);
        }
    }    var o2 = new CO();

기본 아이디어 생성자 상속의 방법은 매우 간단합니다. 즉, 하위 유형 생성자 내부에서 상위 유형 생성자를 호출하는 것입니다. 함수는 특정 환경에서 코드를 실행하는 객체일 뿐이므로, Apply() 및 call() 메서드를 사용하여 새로 생성된 객체에 대해서도 생성자를 실행할 수 있습니다.

   function superType(){
       this.colors = ["red","blue","green"];
   }   function subtype(){
       superType.call(this);
   }   var instance1 = new subtype();
   instance1.colors.push("black");
   alert(instance1.colors);//"red,blue,green,black"
   var instance2 = new subtype();
   alert(instance2.colors);//"red,blue,green"

call()을 사용하면 실제로 새로 생성된 하위 유형 인스턴스의 컨텍스트에서 supertype() 생성자를 호출하는 것입니다. 이러한 방식으로 상위 유형 생성자는 새 하위 유형 객체에서 실행되므로 다음에서 실행됩니다. 하위 유형 supertype() 함수에 정의된 모든 객체 초기화 코드는 객체에서 실행됩니다

   function superType(name){
       this.name = name;
   }   function subtype(){
       superType.call(this,"Marry");       this.age = 29;
   }   var instance = new subtype();
   alert(instance.name);//"Marry"
   alert(instance2.age);//"29"

이것은 생성자의 큰 장점이며 하위 유형 생성자에서 매개 변수를 상위 유형 생성자에 전달할 수 있습니다.

이 기사에서는 JS 상속에 대한 이해를 설명합니다. 더 많은 관련 내용을 보려면 PHP 중국어 웹사이트를 참고하세요.

관련 권장 사항:

JS 암호 해독, 온라인 JS 암호 해독 및 암호 해독

JS 코드 최적화 방법

JavaScript 로컬 개체

위 내용은 JS의 상속 이해의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!