javascript prototype原型操作筆記
//var People={name:"xiong",age:15};
//var Person=function(user,age){
// this.name=user;
// this.age=age;
// this.say=function(){alert("I am "+this.name+"\n"+this.age);}
//}
//var Chairman=function(name,salary){
// Person.call(this,name);
// }
//var Bill=new Person("Bill",15);
//var Hu=new Chairman("Hu Jintao");
//Person.prototype.eat=function(){
// alert("I'm eating");
// }
//Bill.eat();
function Person(name) //基類構(gòu)造函數(shù)
{
this.name = name;
};
Person.prototype.SayHello = function() //給基類構(gòu)造函數(shù)的 prototype 添加方法
{
alert("Hello, I'm " + this.name);
};
function Employee(name, salary) //子類構(gòu)造函數(shù)
{
Person.call(this, name); //調(diào)用基類構(gòu)造函數(shù)
this.salary = salary;
};
function Xiong(name,age){
Employee.call(this,name);
}
Employee.prototype = new Person(); //建一個(gè)基類的對(duì)象作為子類原型的原型,這里很有意思
Xiong.prototype=new Employee();
Employee.prototype.ShowMeTheMoney = function() //給子類添構(gòu)造函數(shù)的 prototype 添加方法
{
alert(this.name + " $" + this.salary);
};
var BillGates = new Person("Bill Gates"); //創(chuàng)建基類 Person 的 BillGates 對(duì)象
var SteveJobs = new Employee("Steve Jobs", 1234); //創(chuàng)建子類 Employee 的 SteveJobs對(duì)象
var hiakuotiankong=new Xiong("海闊天空");
var benbenxiong=new Xiong("笨笨熊");
// BillGates.SayHello(); //通過(guò)對(duì)象直接調(diào)用到 prototype 的方法
// hiakuotiankong.SayHello(); //通過(guò)子類對(duì)象直接調(diào)用基類 prototype 的方法,關(guān)注!
benbenxiong.SayHello=function(){ //掩蓋了原型的 SayHello 方法
alert("haha,I'm"+this.name);
}
benbenxiong.SayHello();
// SteveJobs.ShowMeTheMoney(); //通過(guò)子類對(duì)象直接調(diào)用子類 prototype 的方法
// alert(BillGates.SayHello == SteveJobs.SayHello); //顯示:true,表明 prototype 的方法是共享的
Xiong.prototype.Goodbye=function(){
alert(this.name+"Bye-bye");
}
benbenxiong.Goodbye();
在 JavaScript 中,prototype 不但能讓對(duì)象共享自己財(cái)富,而且 prototype 還有尋根問(wèn)祖的
天性,從而使得先輩們的遺產(chǎn)可以代代相傳。當(dāng)從一個(gè)對(duì)象那里讀取屬性或調(diào)用方法時(shí),如果該對(duì)象自
身不存在這樣的屬性或方法,就會(huì)去自己關(guān)聯(lián)的 prototype 對(duì)象那里尋找;如果 prototype 沒(méi)有,又會(huì)
去 prototype 自己關(guān)聯(lián)的前輩 prototype 那里尋找,直到找到或追溯過(guò)程結(jié)束為止。
在 JavaScript 內(nèi)部,對(duì)象的屬性和方法追溯機(jī)制是通過(guò)所謂的 prototype 鏈來(lái)實(shí)現(xiàn)的。當(dāng)用 new
操作符構(gòu)造對(duì)象時(shí),也會(huì)同時(shí)將構(gòu)造函數(shù)的 prototype 對(duì)象指派給新創(chuàng)建的對(duì)象,成為該對(duì)象內(nèi)置的原
型對(duì)象。對(duì)象內(nèi)置的原型對(duì)象應(yīng)該是對(duì)外不可見(jiàn)的,盡管有些瀏覽器(如 Firefox)可以讓我們?cè)L問(wèn)這個(gè)
內(nèi)置原型對(duì)象,但并不建議這樣做。內(nèi)置的原型對(duì)象本身也是對(duì)象,也有自己關(guān)聯(lián)的原型對(duì)象,這樣就
形成了所謂的原型鏈。
在原型鏈的最末端,就是 Object 構(gòu)造函數(shù) prototype 屬性指向的那一個(gè)原型對(duì)象。這個(gè)原型對(duì)象
是所有對(duì)象的最老祖先,這個(gè)老祖宗實(shí)現(xiàn)了諸如 toString 等所有對(duì)象天生就該具有的方法。其他內(nèi)置
構(gòu)造函數(shù),如 Function, Boolean, String, Date 和 RegExp 等的 prototype 都是從這個(gè)老祖宗傳承下
來(lái)的,但他們各自又定義了自身的屬性和方法,從而他們的子孫就表現(xiàn)出各自宗族的那些特征。
- javascript prototype的深度探索不是原型繼承那么簡(jiǎn)單
- JavaScript為對(duì)象原型prototype添加屬性的兩種方式
- js中使用使用原型(prototype)定義方法的好處詳解
- javascript prototype原型詳解(比較基礎(chǔ))
- javascript prototype 原型鏈
- JS構(gòu)造函數(shù)與原型prototype的區(qū)別介紹
- 跟我學(xué)習(xí)javascript的prototype原型和原型鏈
- js使用原型對(duì)象(prototype)需要注意的地方
- 淺談js構(gòu)造函數(shù)的方法與原型prototype
- [js高手之路]圖解javascript的原型(prototype)對(duì)象,原型鏈實(shí)例
- Javascript 原型和繼承(Prototypes and Inheritance)
- JS原型prototype和__proto__用法實(shí)例分析
相關(guān)文章
用javascript動(dòng)態(tài)調(diào)整iframe高度的代碼
用javascript動(dòng)態(tài)調(diào)整iframe高度的代碼...2007-04-04通過(guò)Javascript讀取本地Excel文件內(nèi)容的代碼示例
這篇文章主要介紹了通過(guò)Javascript讀取本地Excel文件內(nèi)容的代碼示例,但需要一定的條件才可以使用js操作本地文件,需要的朋友參考下吧2014-04-04toString.call()通用的判斷數(shù)據(jù)類型方法示例
這篇文章主要給大家介紹了關(guān)于toString.call()通用的判斷數(shù)據(jù)類型方法的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08JavaScript使用FileReader實(shí)現(xiàn)圖片上傳預(yù)覽效果
這篇文章主要為大家詳細(xì)介紹了JavaScript使用FileReader實(shí)現(xiàn)圖片上傳預(yù)覽效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-09-09JS實(shí)現(xiàn)提交表單前的數(shù)字及郵箱校檢功能
在項(xiàng)目開(kāi)發(fā)中經(jīng)常會(huì)遇到表單提交功能,今天小編抽空給大家分享JS實(shí)現(xiàn)提交表單前的數(shù)字及郵箱校檢功能,需要的朋友參考下吧2017-11-11使用canvas實(shí)現(xiàn)鯉魚(yú)躍龍門(mén)的動(dòng)畫(huà)效果
這篇文章主要給大家介紹了使用canvas實(shí)現(xiàn)鯉魚(yú)躍龍門(mén)的動(dòng)畫(huà)效果,文中通過(guò)代碼示例給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作有一定的幫助,感興趣的小伙伴可以自己動(dòng)手嘗試一下2024-02-02Javascript中判斷一個(gè)值是否為undefined的方法詳解
這篇文章給大家詳細(xì)介紹了在Javascript中如何判斷一個(gè)值是否為undefined,對(duì)大家的日常工作和學(xué)習(xí)很有幫助,下面來(lái)一起看看吧。2016-09-09JS可斷點(diǎn)續(xù)傳文件上傳實(shí)現(xiàn)代碼解析
這篇文章主要介紹了JS可斷點(diǎn)續(xù)傳文件上傳實(shí)現(xiàn)代碼解析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-07-07