1. 程式人生 > >深入學習jquery原始碼之繼承方案的選擇

深入學習jquery原始碼之繼承方案的選擇

prototype實現繼承

先訪問自己本身的方法,沒有再訪問自己原型的方法,本身原型沒有訪問父類,父類沒有,訪問父類的原型方法...繼續往上

    Object.prototype.say=function  () { //最上層定義say的方法
       alert("我是頂層的方法");
	}
	function person () {
	    this.say=function  () {
		   alert("我是父類的方法");//先訪問本身方法,再訪問原型方法
	    }
	}
 
	person.prototype.say=function  () {
	     alert("我是父類原型的方法");
	}
 
	function study () {
	this.say=function  () {
	   alert("本身的方法");
	     }
    }

	study.prototype=new person();

	 study.prototype.say=function  () {
	   alert("本身原型的方法");
	 } 

    var zhangsan=new study ();
	alert(zhangsan.say)//父類有方法,不再向頂層找方法

 

create()實現繼承

create的第二引數是一個物件,其中的屬性如果和person重名,則會覆蓋person的屬性。

var person={
        name:"Tom",
        age:23,
        job:"廚師"
    };
    var anotherPerson=Object.create(person,{
        name:{
            value:"Mike"
        }
    });
    alert(anotherPerson.name);

 

apply()實現屬性和方法繼承全部繼承

apply : obj1.fun.apply(obj2,[引數1,引數2....]) 讓物件1的方法冒充成物件2的方法。

function person (name) {
   this.name=name;//this代表window this那個物件引用,就是那個物件的函式function person()
   this.say=function  () {
     alert(this.name)
   }
}
 
function student () {
 window.person.cell(this)//this代表zhangsan
}
var zhangsan=new student ();
zhangsan.name;//張三
 
function student () {
 window.person.apply(this,["zhangsan"])//引數以陣列形式傳遞
}
 
var zhangsan=new student ();
  zhangsan.name;
  zhangsan.say();

js實現多型

function Animal(name,age){
		this.name=name;
		this.age=age;
		this.shout=function(){
			alert("我是:"+this.name+",今年:"+this.age);
		};
		this.action=function(){
			alert("會吃");
		};
	}
	
	function Dog(name,age){
		Animal.apply(this, [name,age]);//this當前物件,name傳入的引數,原型還是Animal
	}

    Dog.prototype=new Animal();//型別的繼承,原型變了不再是Animal,擁有了Animal物件的屬性和方法
	
	var jack=new Dog("jack",1);
	alert(jack.name);
	alert(jack.age);
	jack.shout();//呼叫父類的方法
	jack.action();

 

建構函式call()

call : obj1.fun.call(obj2,引數1......).讓物件1的方法冒充成物件2的方法。

function person () {
   this.name="張三";
   this.say=function  () {
     alert(this.name)
   }
}
 
function student () {
  this.name="李四";
}
var ren=new person ();
var zhangsan=new student ();//也有了say方法
 
ren.say.call(zhangsan)

 

建構函式也可以通過子物件向父物件傳遞引數

function SuperType(name){
        this.name=name
    }
    function SubType(){
        SuperType.call(this,"Tom")//或者apply()
    }
    var instance1=new SubType();
    alert(instance1.name);