JavaScript_Basic 지식으로 프로토타입과 상속에 대한 심층적인 이해

일반적으로 JavaScript의 객체는 프로토타입에 대한 포인터이자 자체 속성 목록입니다. JavaScript는 객체를 생성할 때 쓰기 중 복사 개념을 사용합니다.
생성자만이 프로토타입 속성을 가지고 있습니다. 프로토타입 체인 상속은 생성자의 프로토타입 속성을 가리키는 새 포인터를 생성하는 것입니다.
프로토타입 속성이 특별한 이유는 JavaScript에서 속성을 읽을 때의 순회 메커니즘 때문입니다. 본질적으로 그것은 단지 일반적인 포인터입니다.

생성자에는 다음이 포함됩니다.
1.Object
2.Function
3.Array
4.Date
5.String

예를 들어보겠습니다

코드 복사 코드는 다음과 같습니다

<script> <br>//각 함수에는 기본 속성 프로토타입이 있으며 이 프로토타입의 생성자는 기본적으로 이 함수를 가리킵니다. <br>//Person.constructor는 Person과 동일하지 않습니다. 프로토타입.constructor. 함수 인스턴스에는 생성자 속성이 있습니다. <br> function Person(name) { <br> this.name = name <br> } <br> Person.prototype.getName = function() { <br> return this.name; <br> }; <br> var p = new Person("ZhangSan"); <br><br> console.log(Person.prototype.constructor === Person); console.log( p.constructor === Person); // true, p 자체에는 생성자 속성이 포함되어 있지 않기 때문에 여기서 실제로 호출되는 것은 Person.prototype.constructor <br></script>

우리의 목적은
1. Person이 Animal로부터 상속받았음을 나타냅니다2. p2가 Person
의 인스턴스임을 나타냅니다.

Person이 Animal의 프로토타입 속성에서 메서드를 얻을 수 있도록 프로토타입 속성의 포인팅을 수정해 보겠습니다. 즉, 사람은 동물(사람은 짐승이다)을 물려받는다

코드 복사 코드는 다음과 같습니다.

<script> (이름) { <br> this.name = 이름; <br> }; <br> Person.prototype.getName = function() { <br> return this.name <br> var p1 = new Person( "ZhangSan"); <br><br> console.log(p.constructor === Person); // true <br> console.log(Person.prototype.constructor === Person); 사실 <br> <br> function Animal(){ } <br> Person.prototype = new Animal(); //Person.prototype = Animal.prototype을 사용하지 않는 이유는 new에 다른 기능이 있기 때문입니다. <p> var p2 = new Person("ZhangSan"); <br><br>//(p2 -> Person.prototype -> Animal.prototype이므로 p2.constructor는 실제로 Animal.prototype.constructor입니다)<br><br> console.log(p2.constructor === Person); // 출력은 false이지만 원래 의도는 p2가 Person의 인스턴스임을 나타내는 true입니다. 현재 목표 1은 달성했지만, 목표 2는 달성하지 못했습니다. <br></script>

그런데 이렇게 수정하면

Person.prototype = new Animal()
Person.prototype.constructor = Person
여기서 시간 p2 생성자가 맞습니다. 이는 Person을 가리키며 p2가 Person 클래스의 인스턴스임을 나타냅니다. 그러나 새로운 문제가 발생합니다. 현재 목표 2는 달성했지만, 목표 1은 달성하지 못했습니다.
목적 1과 목적 2는 이때 서로 모순됩니다. 프로토타입은 이때 두 가지 상반된 의미를 표현하기 때문에
1은 상위 클래스가 누구인지 나타냅니다.
2는 자체 인스턴스의 프로토타입으로 복사됩니다.

그러므로 상위 클래스가 누구인지 나타내기 위해 프로토타입 속성을 직접 사용할 수는 없지만, 상위 클래스가 누구인지 알아내기 위해서는 getPrototypeOf() 메소드를 사용합니다.

코드 복사 코드는 다음과 같습니다.Person.prototype = new Animal();

Person.prototype.constructor = Person;

var p2 = new Person("ZhangSan");

p2.constructor //함수 표시 Person() {}

Object.getPrototypeOf(Person.prototype).constructor //Animal() 함수 표시 {}

이 두 개념을 구분합니다

마지막으로 요약하자면:
var p = new Person() 코드가 실행되면 new는 다음 작업을 수행합니다.

빈 개체 만들기

Person.prototype에 대한 포인터 만들기

this 키워드를 통해 이 개체를 생성자에 전달하고 생성자를 실행합니다.

Person.prototype = Animal.prototype을 사용하여 Person이 Animal에서 상속되었음을 나타내면, instanceof 메소드는 p도 Animal의 인스턴스임을 표시하고 true를 반환합니다. 이 메소드가 사용되지 않는 이유는 다음과 같습니다. 다음 두 가지 이유:

1.new는 새 객체를 생성합니다. 이는 Person.prototype.constructor = Person으로 설정하면 Animal.prototype.constructor의 값이 Person으로 변경되는 것을 방지하지만 새로 생성된 이 객체에 생성자 인스턴스 속성을 동적으로 제공합니다. 인스턴스의 속성 생성자가 Animal.prototype.constructor를 포함하므로 Person.prototype.constructor와 Animal.prototype.contructor가 분리됩니다.

2. Animal 자신의 속성은 Person에게 전달될 수 없습니다

hasOwnProperty() 메서드를 사용하면 인스턴스 속성에 접근할 때와 프로토타입 속성에 접근할 때 명확해집니다.