深入學習jquery原始碼之繼承方案的選擇
阿新 • • 發佈:2018-12-23
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);