1. 程式人生 > >面向對象、原型鏈、繼承知識梳理

面向對象、原型鏈、繼承知識梳理

中介 獲取 混合 console 原型 code name 諸多 祖先

單例模式:就是一個對象咯

var person={
    name:xuwen,
    age:17
};
var person2={
    name:xiaoxu,
    age:25  
}

工廠模式:就是一個函數,解決批量生產問題

 1 function fn(name,age){
 2     var obj={};
 3     obj.name=name,
 4     obj.age=age,
 5     obj.write=function(){
 6         console.log(obj.name);
 7     }
 8     return
obj; 9 } 10 var person1=fn(‘xuwen‘,17); 11 var person2=fn(‘xiaoxu‘,23); 12 person1.write(); 13 person2.write();

構造函數:也是一個函數,但這個函數new一下的時候,那麽這個函數就會自動產生一個對象(實例),並且最後返回這個對象(實例)。裏面的this指的就是當前對象(實例)。方法裏面的this例外,誰調用這個方法,this就指向誰。

 1 var name=‘xuxu‘;
 2 function Fn(name,age){
 3     this.name=name;    //this指的就是當前實例
4 this.age=age; 5 this.write=function(){ 6 console.log(this.name); //誰調用方法 this就指向誰 7 } 8 } 9 var person1=new Fn(‘xuwen‘,17); 10 var person2=new Fn(‘xiaoxu‘,23); 11 person1.write(); //xuwen 12 person2.write(); //xiaoxu 13 var p3=person1.write; 14 p3(); //xuxu

上面構造函數有一個弊端,對於屬性,每個實例不同,這個沒有問題,但是方法對於每個實例都開辟一個空間來存儲,那就浪費。畢竟每個方法都是一樣,那麽怎麽解決這個問題呢?那就是下面將的原型了。

基於構造函數的原型及原型鏈

 1 function Fn(name,age){
 2     this.name=name;    //this指的就是當前實例
 3     this.age=age;
 4 }
 5 Fn.prototype.write=function(){    //這是一個公共的空間  每個實例調用方法直接到這裏找就行   牽涉到原型鏈  那就講講吧
 6     console.log(this.name);
 7 }
 8 var person1=new Fn(‘xuwen‘,17);
 9 var person2=new Fn(‘xiaoxu‘,23);
10 person1.write();  //xuwen
11 person2.write();  //xiaoxu
12 
13 //原型鏈
14 //每個構造函數都有一個prototype屬性  這個屬性指向(值)存儲著   構造函數.prototype 裏面的東東
15 //每個對象(實例)都有一個__proto__屬性 (頂級Object.prototype這個對象沒有這個屬性)  這個屬性指向(值)  存儲著 構造函數.prototype 裏面的東東
16 //那麽(當然構造函數.prototype也是一個對象,所以構造函數.prototype裏面也有一個__proto__屬性  那麽這個屬性最終都指向Object.prototype)
17 //根據這一樣一級一級形成了原型鏈了

整完原型鏈那麽下面就是繼承了,這個子級構造函數可以獲取到父級構造函數的屬性和方法。這裏就不細講了繼承諸多繼承方法了。就直接用混合繼承方法來結束這一章了。

利用 父級.call(this) 來繼承父級的屬性。

利用一個空函數作中介來繼承原型方法

//該函數功能是實現child只繼承person上prototype屬性或者方法。
function extend(child, person) {
    var F = new Function();
    //當然也可以寫成var F=function(){};    都是一樣的   定義一個空函數而已
    F.prototype = person.prototype; //把這個空函數的prototype屬性指向person原型對象  
    child.prototype = new F(); //child繼承空函數的原型屬性或者方法   就非常幹凈的繼承了person上的方法或屬性了
    child.prototype.constructor = child; //構造器的指向改一下,防止繼承鏈亂序
    child.sub = person.prototype; //自定義一個屬性把person的原型屬性或方法保存下來。
}

function person() {

}

function child() {
    child.sub.constructor.call(this); //等同於person.call(this);
}

在另外補充一下 instanceof 用法就是 person1 instanceof Fn 判斷實例是不是該構造函數下面的 除了父級構造函數 祖先構造函數也會判斷true

hasOwnProperty 用法 person1.hasOwnProperty(‘name‘) 判斷 x 屬性是否是person1的私有屬性 不能判斷原型鏈上 如果要判斷原型鏈上 用 in 關鍵字

代碼就不寫了。

那就這樣結束吧,明天數組和正則吧!

面向對象、原型鏈、繼承知識梳理