자바스크립트 클래스 상속_js 객체지향의 새로운 시도

WBOY
풀어 주다: 2016-05-16 17:57:25
원래의
837명이 탐색했습니다.

오늘 내가 하려는 것은 상속 메커니즘, 다단계 상속 및 부모 클래스 구성 호출의 더 많은 측면을 사용하여 다른 언어와 더 유사하게 만드는 방법입니다.
내가 이루고 싶은 효과 :

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

function A( ){
alert('a');
}
function B(){
this.$supClass()
alert('b'); >}
extend(B,A);
function C(){
this.$supClass()
alert('c')
}
extend(C) ,B);
var c = new C();
alert( c 인스턴스 of A ); //true
alert( c 인스턴스of B ); ; //참


예:



[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다. ]
내 확장은 다음과 같이 작성됩니다.

코드 복사 코드는 다음과 같습니다.
함수 확장 (subClass,supClass){
var fun = function(){},
프로토타입 = subClass.prototype;
fun.prototype = supClass.prototype;
subClass.prototype = new fun();
for(var i in 프로토타입){
subClass.prototype[i] = 프로토타입[i];
}
subClass.$supClass = supClass
subClass.prototype.$supClass = function(){
var supClass =args.callee.caller.$supClass;
if(typeof supClass == 'function'){
supClass.apply(this,arguments)
this. $supClass = supClass;
}
};
subClass.prototype.constructor = subClass;
return subClass;


왜냐고 물으실 수도 있습니다. 이렇게 쓰지 마세요:


function extend(subClass ,supClass){
var fun = function( ){},
prototype = subClass.prototype;
fun.prototype = supClass.prototype;
subClass.prototype = new fun(); >for(프로토타입의 var i){
subClass.prototype[i] = 프로토타입[i]
}
subClass.prototype.$supClass = function(){
supClass.apply(this ,arguments);
subClass.prototype.constructor = subClass;
return subClass;


아주 문제 없을 것 같습니다. 상속 수준이 하나만 있는 경우에는 그렇습니다. 그러나 상속 수준이 여러 개인 경우 다음과 같은 이유로 무한 루프가 발생합니다.



코드 복사
코드는 다음과 같습니다. subClass.prototype.$supClass = function(){ supClass.apply(this,arguments) }; 🎜>
이 메서드는 지속적으로 덮어쓰고 다시 작성되므로 무한 루프가 발생합니다.
내 접근 방식은 클래스의 $supClass 속성을 사용하여 상속받은 상위 클래스 구조를 가리키는 것입니다. 프로토타입에는 $supClass 메서드도 해당 클래스의 생성자에서 실행되어야 합니다. 처음 프로토타입 .$supClass가 실행되면 인수.callee.caller.$supClass를 통해 클래스의 $supClass를 얻은 다음 이에 적용하여 실행합니다. 이러한 방식으로 $subClass는 클래스의 상위 클래스 생성자를 획득하고 다른 값을 기반으로 실행할 수 있습니다.
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿