原型 Prototype


㈠原型 Prototype

⑴我們所創建的每一個函數,解析器都會向函數中添加一個屬性Prototype

    這個屬性對應着一個對象,這個對象就是我們所謂的原型對象

 

⑵如果函數作為普通函數調用prototype沒有任何作用

   當函數以構造函數的形式調用時,它所創建的對象中都會有一個隱含的屬性

   指向該構造函數的原型對象,我們可以通過_ _prototype_ _來訪問

 

⑶示例:

function MyClass(){ } var mc = new MyClass(); var mc2 = new MyClass(); console.log(mc2._ _prototype_ _ == MyClass._ _prototype_ _);

返回結果為:true;

 

原型對象就相當於一個公共的區域所有同一類的實例都可以訪問到這個原型對象

    我們可以將對象中共有的內容統一設置原型對象中。

 

⑸當我們訪問對象的一個屬性或方法時,它會先在對象自身中尋找,如果有則直接使用,

   如果沒有則會去原型對象中尋找,如果找到則直接使用

 

⑹具體圖形演示:

 

示例1:

function MyClass(){ }
//
向MyClass的原型中中添加a屬性
MyClass.prototype.a = 123; 

var mc = new MyClass();

var mc2 = new MyClass();

//向mc中添加a屬性
mc.a
= "我是mc中的a";

console.log(mc.a);
console.log(mc2.a);

結果返回:兩個都返回:123

 

示例2:

function MyClass(){ } //向MyClass的原型中中添加a屬性 MyClass.prototype.a = 123; //向MyClass的原型中中添加一個方法 MyClass.prototype.sayHello = function(){ alert("hello"); }; var mc = new MyClass(); var mc2 = new MyClass(); //向mc中添加a屬性  mc.a = "我是mc中的a"; 
mc.sayHello();

結果顯示為:hello

 

⑺以后我們創建構造函數時,可以將這些對象共有屬性和方法,統一添加到構造函數的原型對象中,

   這樣不用分別為每一個對象添加,也不會影響到全局作用域,就可以使每個對象都具有這些屬性和方法了

 

㈡原型對象

創建一個構造函數

function MyClass(){ } //向MyClass的原型中添加一個name屬性 MyClass.prototype.name = "我是原型中的名字"; var mc = new MyClass(); console.log(mc.name);

結果返回:我是原型中的名字

 

⑴使用in檢查對象中是否含有某個屬性時,如果對象中沒有但是原型中有,也會返回true

   console.log("name" in mc);

   結果會返回:true

 

⑵可以使用對象的hasOwnPrototype( )來檢查對象自身是否含有該屬性

   使用該方法只有當對象自身含有屬性時,才會返回true

   console.log(mc.hasOwnPrototype("age"));

   結果返回:true

   console.log(mc.hasOwnPrototype("hasOwnProperty"));

   結果返回:false

 

⑶原型對象也是對象,所以它也有原型

      當我們使用一個對象的屬性或方法時,會先在自身中尋找

        自身中如果有,則直接使用

         如果沒有則去原型對象中尋找,如果原型對象中有,則使用

           如果沒有則去原型的原型中尋找,直到找到Object對象的原型

             Object對象的原型是沒有原型的。

                如果在Object中依然沒有找到,則返回undefined

 

⑷具體圖形演示

 

⑸示例:

//在原型中查找

console.log(mc._ _prototype_ _.hasOwnPrototype("hasOwnProperty"));

結果返回:false

 

//在原型的原型中查找

console.log(mc._ _protot_ _._ _protot_ _.hasOwnPrototype("hasOwnProperty"));

結果返回:true

 

//在原型的原型的原型中查找

console.log(mc._ _protot_ _._ _protot_ _._ _protot_ _);

結果返回:null

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM