JavaScript 상속 메커니즘 구현(계속 예정)_js 객체 지향

1. 객체 가장
원리: 생성자는 this 키워드를 사용하여 모든 속성과 메서드에 값을 할당합니다(즉, 클래스 선언의 생성자 메서드 사용).
생성자는 함수일 뿐이므로 ClassA의 생성자를 ClassB의 메서드로 만든 후 호출하면 됩니다. ClassB는 ClassA의 생성자에 정의된 속성과 메서드를 받습니다.
예:
ClassA 및 ClassB는 다음과 같이 정의됩니다.

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

function ClassA(sColor){
this.color=sColor;
this.sayColor=function(){
alert(this.color)
};
}

function ClassB(sColor){
}

this 키워드는 생성자가 현재 생성한 객체를 나타냅니다.
그러나 이 방법에서는 this가 자신이 속한 개체를 가리킵니다. 이 원칙은 ClassA를 구성 라인 번호가 아닌 상속 메커니즘을 설정하는 일반 함수로 사용합니다.
상속 메커니즘은 다음과 같이 생성자 ClassB를 사용하여 구현할 수 있습니다.

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

function ClassB(sColor){
this.newMethod=ClassA;
this.newMethod(sColor)
delete this.newMethod; >
이 코드 In(그러나 여기에 "넣어야" 한다고 생각함) ClassA에는 newMethod 메서드가 할당됩니다(함수 이름은 이에 대한 포인터일 뿐이라는 점을 기억하세요). 그런 다음 이 메서드를 호출하여 ClassB 생성자의 sColor 매개 변수를 전달합니다. 코드의 마지막 줄은 ClassA에 대한 참조를 제거하여 나중에 더 이상 호출할 수 없도록 합니다.
모든 새 속성과 새 메서드는 새 메서드의 코드 줄을 제거한 후 정의해야 합니다. 그렇지 않으면 슈퍼 클래스의 관련 속성과 메서드가 재정의될 수 있습니다.

코드 복사 코드는 다음과 같습니다. function ClassB(sColor,sName){

this.newMethod=classA;

this.newMethod(sColor)
delete this.newMethod; name=sName;
this.sayName=function(){
alert(this.name);
}
}


다음 예제를 실행하세요. >

코드 복사

코드는 다음과 같습니다. var objA=new ClassA("red"); var objB=new ClassB( "blue","Nicholas"); objA.sayColor();//outputs "red" objB.sayColor();//outputs "blue"

objB.sayName(); // "Nicholas" 출력

예를 들어 ClassX와 ClassY라는 두 클래스가 있고 ClassZ가 이 두 클래스를 상속하려는 경우 다음 코드를 사용할 수 있습니다.

코드 복사

코드는 다음과 같습니다. function ClassZ(){ 이것 .newMethod=ClassX; this.newMethod(); delete this.newMethod;

this.newMethod=ClassY;
this.newMethod(); ;
}


여기서 단점이 있습니다. ClassX와 ClassY가 같은 이름의 속성이나 메소드를 가지고 있으면 ClassY가 뒤에서 상속되기 때문에 우선순위가 높습니다. 이 작은 문제 외에도 개체 가장을 사용하여 다중 상속 메커니즘을 구현하는 것은 쉽습니다.
이 상속 메소드의 인기로 인해 ECMAScript의 세 번째 버전에서는 Function 객체에 call() 및 apply()라는 두 가지 새로운 메소드를 추가했습니다.

2. call() 메소드

call() 메소드는 고전적인 객체 가장 메소드와 가장 유사합니다. 첫 번째 매개변수는 이것의 목적으로 사용됩니다. 다른 모든 매개변수는 함수 자체에 직접 전달됩니다. 예:

코드 복사

코드는 다음과 같습니다.

function sayColor(sPrefix,sSuffix ){ alert(sPrefix this.color sSuffix); var obj=new Object() obj.color="red"//outputs "색상 빨간색이군요, 정말 좋은 색이네요." sayColor.call(obj,"The color is ",", 정말 아주 좋은 색입니다.")

이 예에서는 sayColor() 함수가 객체 외부에 정의되어 있으며, 키워드 this는 어떤 객체에도 속하지 않더라도 참조할 수 있습니다. 객체 obj의 색상 속성은 "red"와 같습니다. call() 메서드를 호출할 때 첫 번째 매개 변수는 obj입니다. 이는 sayColor() 함수에서
이 this 키워드에 할당되어야 하는 값이 obj임을 나타냅니다. 두 번째와 세 번째 매개변수는 문자열입니다. sayColor() 함수의 접두사와 접미사 매개변수를 일치시키고 마침내 "색상은 빨간색입니다. 정말 멋진 색상입니다."
이 메서드를 상속 메커니즘의 객체 가장 메서드와 함께 사용하려면, 접두사 바꾸기 할당, 호출 및 삭제 코드 세 줄만 바꾸세요:

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

function ClassB(sColor,sName){
//this.newMethod=classA
//this.newMethod(sColor)
//delete this.newMethod; >Class.call(this ,sColor);

this.name=sName;
this.sayName=function(){
alert(this.name)
}


여기서 ClassA의 this 키워드가 새로 생성된 ClassB 객체와 같기를 원하므로 이것이 첫 번째 매개변수입니다. 두 번째 매개변수인 sColor는 두 클래스 모두에 대한 유일한 매개변수입니다.

3.apply() 메소드
apply() 메소드에는 두 개의 매개변수가 있는데, this로 사용되는 객체와 함수에 전달할 매개변수와 배열입니다. 예:

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

function sayColor(sPrefix,sSuffix ){

alert(sPrefix this.color sSuffix)
var obj=new Object()
obj.color="red"//outputs "색상은 빨간색입니다. 정말 좋은 색상입니다."
sayColor.apply(obj,new Array("색상은 ",",정말 좋은 색상입니다."))


이 예는 이전 예와 동일하지만 이제 apply() 메서드가 호출됩니다. apply() 메소드를 호출할 때 첫 번째 매개변수는 여전히 obj입니다. 이는 sayColor()에서 이 키워드의 값이 obj로 제공되어야 함을 의미합니다. 두 번째 매개변수는 두 개의 문자열로 구성된 배열로, sayColor()의 매개변수 접두어 및 접미어와 일치합니다. 생성된 메시지는 여전히
"The Color is red, a nice color really."입니다.
이 메소드는 새 메소드를 할당, 호출 및 삭제하기 위한 코드의 처음 세 줄을 대체하는 데에도 사용됩니다.

코드 복사

코드는 다음과 같습니다. function ClassB(sColor,sName){ //this.newMethod =classA;

//this.newMethod(sColor);//delete this.newMethod;

ClassA.apply(this,new Array(sColor));
this.name =sName;
this.sayName=function(){
alert(this.name)
}
}


첫 번째 매개변수는 여전히 이것입니다. 두 번째 매개변수는 색상이라는 하나의 값만 갖는 배열입니다. ClassB의 전체 인수 객체를 apply() 메소드에 두 번째 매개변수로 전달할 수 있습니다:




코드 복사

코드는 다음과 같습니다. 다음:

function ClassB(sColor,sName){ //this.newMethod=classA //this.newMethod(sColor)// this.newMethod 삭제 ; ClassA.apply(this,arguments);

this.name=sName;
this.sayName=function(){
alert(this.name);
} ;
}


물론, 매개변수 객체는 슈퍼클래스의 매개변수 순서가 하위클래스의 매개변수 순서와 정확히 동일한 경우에만 전달될 수 있습니다. 그렇지 않은 경우 올바른 순서로 매개변수를 사용하여 별도의 배열을 만들어야 합니다. 또한 call() 메서드를 사용할 수도 있습니다.