JavaScript 프로토타입 상속의 기본 메커니즘 분석_javascript 기술

이 언어 기능의 핵심은 JavaScript의 고유한 프로토타입 체인 패턴에 의존합니다.
엄밀히 말하면 JavaScript는 프로토타입 기반의 객체 지향 언어입니다. 즉, 모든 인스턴스 객체에는 프로토타입이 있습니다. 객체는 이 프로토타입에서 속성과 메서드를 상속합니다.

1. 생성자

생성자를 이용하면 간단하게 객체를 생성할 수 있습니다. 생성자의 this 키워드는 인스턴스 객체 자체를 가리킵니다.

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

function People(name){
this.name = name;
}

인스턴스 객체를 생성하려면 new 연산자와 생성자를 사용하세요.

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

var people = new People('Xiao Ming')
console; .log(people.name); //Xiao Ming

그러나 두 개의 인스턴스가 생성되면 두 인스턴스 간에 속성과 메서드를 직접 공유할 수 없습니다.

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

var people1 = new People('Xiao Ming')
var people2 = new People('Xiao Wang');
people1.sex = 'male';
console.log(people2.sex); //undefine

즉, 객체가 인스턴스화되면 해당 속성과 메서드는 독립적으로 존재합니다. 한 속성을 수정해도 다른 인스턴스에는 영향을 미치지 않습니다.

2. Prototype

그래서 인스턴스 객체 생성 시 자동으로 생성되는 프로토타입 속성이 있습니다. 이는 인스턴스 간에 공유할 수 있는 속성과 메서드를 포함하는 그 자체로 개체입니다. 인스턴스 자체의 속성과 메서드는 생성자에 포함됩니다. 즉, 생성자 내부의 속성과 메서드는 인스턴스화 후 로컬 속성과 메서드가 되는 반면, 프로토타입의 속성과 메서드는 인스턴스 내의 참조일 뿐이므로 여러 인스턴스에서 공유할 수 있습니다.

지금은 동일한 생성자입니다. 이제 여기에 프로토타입 속성을 추가하세요.

코드 복사 코드

People.prototype.sex = 'female';
//또는 People.prototype = {sex: 'female'}
console.log( people1.sex); // 남성
console.log(people2.sex); //여성

People 생성자의 프로토타입 속성 매개변수는 people1과 people2의 두 인스턴스에 직접적인 영향을 미칩니다. .

그런데 people1.sex가 남성을 출력하는 이유는 JavaScript에서 프로토타입 관계가 재귀적인 형태로 존재하기 때문입니다. 객체의 프로토타입도 객체이고, 프로토타입 자체가 프로토타입을 가질 수 있습니다. 가장 높은 수준의 프로토타입은 전역 Object 객체입니다.

즉, people1.sex가 남성으로 설정되면 프로토타입의 해당 값이 노출될 수 없습니다. people1.sex 자체에 값이 없으면 생성자의 프로토타입 속성에서 읽어서 Object 개체까지 한 번에 한 수준씩 위쪽으로 검색합니다.

참고: "null"을 사용하여 개체에 값을 할당하면 사용자 정의 개체가 삭제되고 메모리 리소스가 해제될 수 있습니다.