javascript 계승의 실현

2837 단어
상속 모드 1,
var Parent = function(name){
    this.name = name || 'parent';
}

Parent.prototype = {
    obj:{a: 1},
    
    getName: function(){
        return this.name;
    }
}

var Child = function(name){
    this.name = name || 'Child';
}

Child.prototype = new Parent()

var p = new Parent();

var c = new Child();

console.log( p.getName() )
console.log( c.getName() )

단점: 하위 클래스가 부류 구조기의 초기화를 실현하려면 다시 써야 한다.
모드 2,
var Parent = function(name){
    this.name = name || 'parent';
}

Parent.prototype = {
    obj:{a: 1},
    
    getName: function(){
        return this.name;
    }
}

var Child = function(name){
    Parent.apply(this, arguments);  //  
}

Child.prototype = new Parent()

var p = new Parent();

var c = new Child('child');

console.log( p.getName() )
console.log( c.getName() )

단점: 부류 구조 함수는 두 번 실행되었는데, 한 번은 부류 구조 함수 중, 한 번은 부치 부류 원형일 때 이것은 매우 많다.
모드 3,
var Parent = function(name){
    this.name = name || 'parent';
}

Parent.prototype = {
    obj:{a: 1},
    
    getName: function(){
        return this.name;
    }
}

var Child = function(name){
    Parent.apply(this, arguments); 
}

Child.prototype = Parent.prototype  // 

var p = new Parent();

var c = new Child('child');

console.log( p.getName() )
console.log( c.getName() )

단점: 하위 클래스의 수정은 상위 클래스의 값을 변경합니다.
모드 4,
var Parent = function(name){
    this.name = name || 'parent';
}

Parent.prototype = {
    getName: function(){
        return this.name;
    },
    obj: {a:1}
}

var Child = function(){
    Parent.apply(this, arguments);
}

var F = function(){}

F.prototype = Parent.prototype;

Child.prototype = new F();

var p = new Parent('parent');
var c = new Child('child');

console.log(child.obj.a) ; //1
console.log(parent.obj.a) ; //1
child.obj.a = 2 ;
console.log(child.obj.a) ; //2
console.log(parent.obj.a) ; //2

모드 5,
var deepClone = function(source,target){
    source = source || {} ;
    target = target || {};

    for(var i in source){
        if(source.hasOwnProperty(i)){

            if(typeof source[i] === 'object'){
                target[i] = (source[i] instanceof Array) ? [] : {};
                deepClone(source[i],target[i]) ;    
            }else{
                target[i] = source[i];
            }
        }
    }
    return target ;
} ;

var extend = function(Parent,Child){
    Child = Child || function(){} ;    
    if(Parent === undefined)        
        return Child ;    // 
    Child = function(){
        Parent.apply(this,argument) ;
    } ;   
    //     
    Child.prototype = deepClone(Parent.prototype) ;    
    // constructor 
    Child.prototype.constructor = Child ;
} ;

좋은 웹페이지 즐겨찾기