코드를 시작하기 전에 상속의 목적과 어떤 이점이 가져올 수 있는지 명확하게 이해해야합니다. 일반적으로 클래스를 설계 할 때 중복 코드를 줄이고 클래스 간 커플 링을 약화시키기를 희망합니다. 우리는 특정 조건과 환경에 따라 어떤 방법을 취해야하는지 결정해야합니다. Face -Object 언어의 상속에 대한 이해에 따르면, 상속은 직접적인 강력한 커플 링을 가져올 것이지만, 고유 한 유연성으로 인해 JS는 강력한 커플 링 및 약한 커플 링 코드, 높은 효율 및 비효율적 인 코드를 설계 할 수 있습니다. 그리고 당신이 사용하는 것은 상황에 달려 있습니다.
다음은 JS에서 세 가지 상속 방법을 제공합니다 : 클래스 상속, 프로토 타입 상속 및 혼합. 다음은 수업의 상속에 대한 간단한 설명입니다.
수업 양식 상속.
JS 유형의 상속의 실현은 프로토 타입 체인에 따라 다릅니다. 원래 체인은 무엇입니까? JS의 객체는 속성 프로토티가 있습니다.
그건 그렇고, 우리는 종종 코드를 사용합니다.
다음과 같이 코드 코드를 복사하십시오.
var person = function () {
this.name = "liyatang";
};
person.prototype = {
// 여기에서 사람의 기본 기능을 제공 할 수 있습니다.
getName : function () {
이 this.name;
}
}
우리는 클래스의 기본 기능을 프로토 타입 속성에 넣었습니다.
프로토 타입을 이해 한 후에는 원래 체인이 무엇인지 이해해야합니다. 방문 객체의 멤버 (속성 또는 방법)가 현재 객체에서 멤버가 표시되지 않으면 JS는 프로토 타입 속성에서 언급 된 객체에서 찾을 수 있습니다. 찾을 수 없으면 undifined로 돌아갑니다.
그렇다면 원래 체인이 우리에게주는 프롬프트는 무엇입니까? 기본 체인은 한 클래스가 다른 클래스를 상속받을 수 있다는 것을 쉽게 생각할 수 있습니다. 이것은 부모 클래스의 멤버를 하위 클래스에 바인딩합니다. 하위 클래스에서 찾을 수 없을 때 부모 클래스를 찾을 수 있기 때문입니다. (위의 두 단어 단락은 엄격하지 않으며 쉽게 이해하는 단어로만 설명됩니다).
아래에서는 중국어 수업이 필요하며 개인 수업의 이름과 이름을 상속해야합니다.
다음과 같이 코드 코드를 복사하십시오.
var Chinese = 함수 (이름, 국가) {
// 상속, 부모 클래스의 생성자를 호출해야합니다. 전화로 호출 할 수 있습니다.
// 사람 에게이 범위에서 사람에게 전화 할 수 있습니다
person.call (this, name);
this.nation = National;
};
중국어 .prototype = person.prototype;
// 프로토 타입 속성이 덮여 있기 때문에 이전과 동일하지 않습니다.
//chinese.prototype = {
// getNation : function () {{
// this.nation;
//}
//};
// 미래의 방법은 다음과 같이 추가해야합니다.
중국어 .prototype.getnation = function () {
this.nation을 반환하십시오.
};
상속 관계가 확립되어 있습니다.
다음과 같이 코드 코드를 복사하십시오.
var c = 새로운 중국어 ( "liyatang", "China");
경고 (c.getName ());
따라서 유형의 상속이 완료됩니다. 실제로 완료 되었습니까? FireBug를 사용하여 경고 포인트를 설정하면 원래 Person.Prototype이 수정되어 GetNation 방법을 추가했습니다.
위의 코드 중국어. proTOTYPE = person.prototype; 이것은 그 자체로 견딜 수 없으며, 우리가 원하는 효과가 아닙니다.
다른 객체 또는 인스턴스에서 커플 링을 약화시킬 수 있습니다.
다음과 같이 코드 코드를 복사하십시오.
//
//chinese.prototype = new Person ();
// 두 번째 유형
// var f = function () {};
//f.prototype = person.prototype;
//chinese.prototype = F. prototype;
이 두 방법의 차이점은 무엇입니까? 두 번째 유형에 빈 함수 f 추가. 부모 클래스가 클 수 있고 상위 클래스 구조 함수는 부작용이 있거나 많은 계산이 있으므로 부모 클래스 생성 인스턴스를 피할 수 있습니다. 수행됩니다. 작업. 따라서 두 번째 방법을 권장합니다.
이 시점에서 아직 끝났습니다! 객체 속성의 속성에 대한 속성이 있으며, 이는 특정 객체 인스턴스의 함수에 대한 참조를 보존합니다. 이 진술에 따르면, Chiese.prototype.constructor는 실제로는 그렇지 않은 중국어와 같아야합니다.
Chiese의 프로토 타입 체인이 추억 전에 설치되었을 때, 우리는 Chiese.prototype에서 person.prototype를 덮었습니다. 따라서 현재 Chiese.prototype.constructor는 사람입니다. 또한 다음 코드를 추가해야합니다
다음과 같이 코드 코드를 복사하십시오.
// 여기에서 IF 조건을 조사 할 필요가 없습니다.
if (중국어 .prototype.constructor == Object.Prototype.constructor) {
중국어 .prototype.constructor = 중국어;
}
다음과 같이 전체 코드로 전환하십시오
다음과 같이 코드 코드를 복사하십시오.
var person = function (name) {
this.name = 이름;
};
person.prototype = {
getName : function () {
이 this.name;
}
};
var Chinese = 함수 (이름, 국가) {
person.call (this, name);
this.nation = National;
};
var f = function () {};
f. prototype = person.prototype;
중국어. 프로토 타입 = F. prototype;
if (중국어 .prototype.constructor == Object.Prototype.constructor) {
중국어 .prototype.constructor = 중국어;
}
중국어 .prototype.getnation = function () {
this.nation을 반환하십시오.
};
var c = 새로운 중국어 ( "liyatang", "China");
알림 (c.getName ());
상속 코드를 함수에 넣을 수 있다면 코드가 재사용하는 것이 편리하며 마지막 정렬은 다음과 같습니다.
다음과 같이 코드 코드를 복사하십시오.
함수 확장 (서브 클래스, 슈퍼 클래스) {{
var f = function () {};
f. prototype = superclass.prototype;
subclass.prototype = new f ();
Subclass.prototype.constructor = 서브 클래스;
subclass.superclass = superclass.prototype; // 상위 클래스에 속성을 추가하십시오.
if (superclass.prototype.constructor == Object.Prototype.constructor) {
Superclass.prototype.constructor = 슈퍼 클래스;
}
}
var person = function (name) {
this.name = 이름;
};
person.prototype = {
getName : function () {
이 this.name;
}
};
var Chinese = 함수 (이름, 국가) {
person.call (this, name);
this.nation = National;
};
확장 (중국어, 사람);
중국어 .prototype.getnation = function () {
this.nation을 반환하십시오.
};
var c = 새로운 중국어 ( "liyatang", "China");
알림 (c.getName ());
출판 후 수정 :
1 층에 대한 의견에 따라, 나는 그 확장 기능에 대한 새로운 견해를 가지고 있습니다. 원래 체인을 설정하는 방법을 논의 할 때 두 가지 방법이 제안되었습니다.
다음과 같이 코드 코드를 복사하십시오.
//
//chinese.prototype = new Person ();
// 두 번째 유형
// var f = function () {};
//f.prototype = person.prototype;
//chinese.prototype = F. prototype;
부모 클래스의 구성 기능을 줄이는 두 번째 방법이지만, Call (이 이름)은 중국어 클래스를 설계 할 때 사용됩니다.
그러나 첫 번째 방법에서는 사람을 줄일 수 있습니다. 이 기능 코드를 확장 할 수 있습니다. 그냥 쓰십시오
중국어. 프로토 타입 = 새로운 사람 ()도 같은 목적을 달성합니다.
그러나 건망증은 중국어입니다. prototype = new person (); 대답이 잘못되었습니다! 분명히 새로운 사람 ()은 이름 매개 변수를 전달해야합니다. 우리는 확장 기능 의이 부분을 수행 할 수 없으므로 중국어 클래스에서 부모 클래스 생성자를 호출해야합니다. 이것은 또한 객체 지향적 아이디어와 일치합니다.
따라서 두 번째 방법을 사용하는 것이 좋습니다.
내가 이런 식으로 기술 기사에 대해 처음 썼을 때, 기본적으로 그것은 내 자신의 생각에 따라 포장되어 있습니다.