자바스크립트 상속의 두 가지 형태는 무엇입니까?

Javascript 상속에는 "객체 가장"과 "프로토타입 모드"라는 두 가지 형식이 있습니다. 개체 가장의 본질은 이 점을 바꾸는 것입니다. 프로토타입 상속은 특성 메서드 복사 목적을 달성하기 위해 어떤 방식으로든 프로토타입을 사용하거나 프로토타입을 재정의하는 것을 의미합니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

Javascript 자체는 Perl 언어의 구문에서 발전했습니다. 본질적으로 버전이 업데이트됨에 따라 객체 지향 시뮬레이션이 추가됩니다.

JS의 객체지향 시뮬레이션은 일반적으로 좋다고 생각합니다. 왜냐하면 우리는 어떤 개념도 맹목적으로 따를 수 없고 순전히 OOP를 위해서 OOP를 할 수 없기 때문입니다. 우리가 파악해야 할 것은 객체지향의 이점이 무엇입니까? 이러한 이점을 위해 OOP로 가는 것이 가장 현명한 선택이므로 Js는 꽤 잘하고 있습니다.

J의 상속은 많은 책에서 여러 유형과 구현 방법으로 신중하게 구분되어 있으며 일반적으로 객체 가장과 프로토타입 방법의 두 가지 유형이 있습니다. 두 방법 모두 장단점이 있습니다. 먼저 여기에 나열한 다음 하위 수준과의 차이점을 분석하겠습니다.

(1) 개체 가장

function A(name){
this.name = name;
this.sayHello = function(){alert(this.name+” say Hello!”);};
}
function B(name,id){
this.temp = A;
this.temp(name); //相当于new A();
delete this.temp; //防止在以后通过temp引用覆盖超类A的属性和方法
this.id = id;
this.checkId = function(ID){alert(this.id==ID)};
}

개체 B를 구성할 때 temp를 호출하는 것은 시작하는 것과 같습니다. A 함수의 구성, 여기서 컨텍스트의 this 개체는 B의 인스턴스이므로 A 생성자 스크립트를 실행할 때 모든 A의 변수와 메서드는 this가 가리키는 개체, 즉 B의 인스턴스, 따라서 B에 도달 A의 속성 메서드의 목적을 상속합니다.

나중에 임시 참조 임시를 삭제하는 것은 B의 A 클래스 객체(인스턴스 객체가 아님)에 대한 참조 변경이 유지되는 것을 방지하기 위한 것입니다. 임시 참조 임시를 변경하면 클래스 A의 구조가 직접 변경되기 때문입니다. (클래스 A의 객체가 아니라는 점에 유의하십시오).

Js 버전 업데이트 과정에서 상속이나 더 넓은 목적을 달성하기 위해 이러한 컨텍스트 전환을 보다 편리하게 수행하기 위해 호출 및 적용 기능이 추가되었음을 확인했습니다. 이들 원칙은 동일하며 매개변수의 버전만 다릅니다(하나의 가변 임의 매개변수, 하나는 매개변수 세트로 배열에 전달되어야 함). 여기서는 호출로 구현된 개체 가장 상속을 설명하기 위해 호출을 예로 들었습니다.

function Rect(width, height){
this.width = width;
this.height = height;
this.area = function(){return this.width*this.height;};
}
function myRect(width, height, name){
Rect .call(this,width,height);
this.name = name;
this.show = function(){
alert(this.name+” with area:”+this.area());
}
}

Call 메소드에 대한 공식 설명: 객체의 메소드를 호출하여 현재 객체를 다른 객체로 대체합니다.

call (thisOb,arg1, arg2…)

이것도 일종의 객체 가장 상속입니다. 실제로 호출 메서드가 호출될 때 발생하는 상황은 myRect 함수 본문에서 myRect 클래스의 인스턴스를 가리켜야 합니다. 그러나 이것을 컨텍스트 환경 변수로 사용하여 Rect 클래스의 생성자인 Rect라는 메서드를 호출합니다.

그래서 이때 Rect를 호출하면 이에 대한 할당 속성과 메서드가 실제로 myRect 개체에서 수행됩니다. 따라서 호출 및 적용은 상속을 위한 새로운 방법은 아니지만 상속을 시뮬레이션하는 데 사용할 수 있습니다.

이것은 객체가 상속인 척하는 것입니다. 이 할당 프로세스를 반복하는 한 다중 상속을 달성할 수 있습니다. 그러나 현재는 실제로 대규모로 사용되지 않습니다. 이유는 무엇입니까?

명백한 성능 결함이 있기 때문에 이는 OO의 개념에 관한 것입니다. 객체 인스턴스를 구성할 때 이러한 인스턴스에는 자체 멤버 변수만 있으면 됩니다. 메소드는 변수에 대해 작동하는 실행 가능한 텍스트 영역일 뿐입니다. 이 영역은 각 인스턴스마다 복사할 필요가 없으며 모든 인스턴스가 이를 공유할 수 있습니다.

이제 JS의 객체 사용으로 돌아가 시뮬레이션된 상속을 가장하기 위해 모든 멤버 메서드가 생성됩니다. 즉, 모든 인스턴스가 멤버 메서드의 복사본을 가지게 되는데, 이는 메모리 리소스를 극도로 낭비하는 것입니다.

객체 가장, 프로토타입 도메인에서 변수 및 메서드 상속 불가 등 다른 결함은 언급할 필요가 없습니다. 이전의 치명적인 결함이면 충분하다고 생각합니다. 그러나 우리는 여전히 이를 이해해야 하며, 특히 부모 클래스의 속성과 메서드가 상속되는 방식에 대한 원칙은 JS 상속을 이해하는 데 매우 중요합니다.

[추천 학습: javascript 고급 튜토리얼]

(2) 프로토타입 방법

두 번째 상속 방법은 소위 프로토타입 방법 상속이란 프로토타입을 사용하거나 어떤 식으로든 덮어쓰는 것을 말합니다. 프로토타입은 속성 메서드 복사의 목적을 달성하는 데 사용됩니다. 이를 구현하는 방법은 다양하고 프레임워크마다 약간의 차이가 있을 수 있지만 원리를 이해하면 이해하지 못할 것이 없습니다. 예(특정 구현)를 살펴보겠습니다.

function Person(){
this.name = “Mike”;
this.sayGoodbye = function(){alert(“GoodBye!”);};
}
Person.prototype.sayHello = function(){alert(”Hello!”);};
function Student(){}
Student.prototype = new Person();

핵심은 마지막 문장의 Student 프로토타입 속성 값을 Person 클래스에 의해 생성된 객체에 할당하는 것입니다. 여기에서 저자는 객체의 속성과 메서드를 설명합니다. 상위 클래스가 하위 클래스에 복사됩니다.

Js 객체는 객체의 속성을 읽을 때 항상 자신의 도메인의 속성 목록을 먼저 확인하고, 존재하면 이를 반환합니다. 그렇지 않으면 프로토타입 도메인을 읽어서 반환합니다. 프로토타입은 다른 객체를 가리킬 수 있으므로 Js 인터프리터는 프로토타입 필드가 가리키는 객체의 프로토타입 필드를 반복적으로 검색하고, 이때 프로토타입 자체를 찾지 못하면 정의되지 않은 상태가 됩니다. .

这样看来，最后一句发生的效果就是将父类所有属性和方法连接到子类的prototype域上，这样子类就继承了父类所有的属性和方法，包括name、 sayGoodbye和sayHello。这里与其把最后一句看成一种赋值，不如理解成一种指向关系更好一点。

这种原型继承的缺陷也相当明显，就是继承时 父类的构造函数时不能带参数，因为对子类prototype域的修改是在声明子类对象之后才能进行，用子类构造函数的参数去初始化父类属性是无法实现的， 如下所示：

function Person(name){
this.name = name;
}
function Student(name,id){
this.id = id;
}
Student.prototype = new Person(this.name);

两种继承方式已经讲完了，如果我们理解了两种方式下子类如何把父类的属性和方法“抓取”下来，就可以自由组合各自的利弊，来实现真正合理的Js继承。下面是个人总结的一种综合方式：

function Person(name){
this.name = name;
}
Person.prototype.sayHello = function(){alert(this.name+“say Hello!”);};
function Student(name,id){
Person.call(this,name);
this.id = id;
}
Student.prototype = new Person();
Student.prototype.show = function(){
alert(“Name is:”+ this.name+” and Id is:”+this.id);

总结就是利用对象冒充机制的call方法把父类的属性给抓取下来，而成员方法尽量写进被所有对象实例共享的prototype域中，以防止方法副本重复创 建。然后子类继承父类prototype域来抓取下来所有的方法。

如想彻底理清这些调用链的关系，推荐大家多关注Js中prototype的 constructor和对象的constructor属性，这里就不多说了。

更多编程相关知识，请访问：编程视频！！

위 내용은 자바스크립트 상속의 두 가지 형태는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!