JS中的prototype與面向?qū)ο蟮膶?shí)例講解
<script language="javascript" type="text/javascript">
//(1)把一個(gè)方法變成一個(gè)對象,為對象創(chuàng)建方法和屬性
var Name = function () {
//通過prototype給一個(gè)對象創(chuàng)建方法
Name.prototype.Add = function (num, title) {
}
//也可以直接用this加方法名為對象創(chuàng)建方法和上面的等價(jià)
this.Way = function (str) {
}
//為對象添加屬性值
Name.prototype.xing = "123";
//定義靜態(tài)屬性和方法
Name.shi = "static";
Name.Addd = function (num, title) {
}
//靜態(tài)定義的局部屬性和方法只能在靜態(tài)的類型里面用
alert(Name.shi);
Name.Addd(1, 2);
}
//方法也可以這樣聲明
function Name1() {
Name1.prototype.add = function () { }
this.way = function () { }
Name1.prototype.shu = "other";
}
//靜態(tài)定義的全局屬性和方法通用
Name.sha = "static";
Name.Addd2 = function () {
}
alert(Name.sha); //調(diào)用靜態(tài)屬性
Name.Addd2(); //調(diào)用靜態(tài)方法
var name = new Name();
name.Add(); //對象調(diào)用方法
name.Way();
alert(name.xing); //對象調(diào)用屬性
/*靜態(tài)的全局變量,在方法外可以調(diào)用;靜態(tài)的局部變量和方法僅限于方法內(nèi)使用;實(shí)例對象不能調(diào)用靜態(tài)的方法 */
/*實(shí)例對象不能使用prototype; */
//(2)Javascript面向?qū)ο?繼承
//父類
function Class() {
this.name = "name";
this.method = function () {
alert("method");
}
}
//子類
function Class1() {
this.name1 = "name1";
this.method1 = function () {
alert("method1");
}
}
//子類繼承父類
Class1.prototype = new Class();
var obj = new Class1();
alert(obj.name);
alert(obj.name1);
obj.method();
obj.method1();
/****** 子類繼承父類的語法,子類.prototype=new 父類(); *****/
//(3)子類重寫父類
//子類
function Class2() {
this.name2 = "name2";
this.method2 = function () {
alert("method2");
}
}
Class2.prototype = new Class(); //繼承
Class2.prototype.name = "updateName"; //重寫父類的屬性
Class2.prototype.method = function () {//重寫父類的方法
alert("UpdateMethod");
}
var obj2 = new Class2();
alert(obj2.name); //顯示updateName
obj2.method(); //顯示UpdateMethod
alert(obj2.name2);
obj2.method2();
//(4){}里面的為對象
var arr = new Array();
arr.push({ "name": "1", "age": 12, funA: function () { } });
arr.push({ "name": "2", "age": 13 });
arr.push({ "name": "3", "age": 14 });
for (var i = 0; i < arr.length; i++) {
alert(arr[i].name);
alert(arr[i].age);
alert(arr[i].funA());
}
/****一個(gè)對象也可以這么定義***/
var newObject = {
"name": "Jim",
"sex": "Man",
Way: function () { }
};
</script>
- 深入了解javascript中的prototype與繼承
- 為JS擴(kuò)展Array.prototype.indexOf引發(fā)的問題探討及解決
- 基于JavaScript實(shí)現(xiàn)繼承機(jī)制之原型鏈(prototype chaining)的詳解
- JavaScript中幾個(gè)重要的屬性(this、constructor、prototype)介紹
- JavaScript prototype 使用介紹
- 判斷js中各種數(shù)據(jù)的類型方法之typeof與0bject.prototype.toString講解
- js中prototype用法詳細(xì)介紹
- js中繼承的幾種用法總結(jié)(apply,call,prototype)
- JavaScript中的prototype.bind()方法介紹
- Javascript中的Prototype到底是什么
相關(guān)文章
一篇文章搞定JavaScript類型轉(zhuǎn)換(面試常見)
這篇文章主要介紹了一篇文章搞定JavaScript類型轉(zhuǎn)換(面試常見),非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下吧2017-01-01JavaScript實(shí)現(xiàn)簡易計(jì)算器小功能
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)簡易計(jì)算器小功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-10-10JavaScript實(shí)現(xiàn)前端網(wǎng)頁版倒計(jì)時(shí)
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)前端網(wǎng)頁版倒計(jì)時(shí),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-03-03后臺(tái)獲取ZTREE選中節(jié)點(diǎn)的方法
這篇文章主要介紹了后臺(tái)獲取ZTREE選中節(jié)點(diǎn)的方法,實(shí)例分析了ZTREE中g(shù)etZTreeObj方法與getCheckedNodes方法的使用技巧,需要的朋友可以參考下2015-02-02對JavaScript的eval()中使用函數(shù)的進(jìn)一步討論
《JavaScript語言精髓與編程實(shí)踐》的讀者I22141提出了一問題:為什么下面這段代碼在JScript 和SpiderMonkey中表現(xiàn)不一樣:2008-07-07ES6入門教程之Iterator與for...of循環(huán)詳解
最近在學(xué)習(xí)ES6,剛剛看到Iterator和for...of循環(huán)這一章,所以想要跟大家略微分享一下,下面這篇文章主要給大家介紹了關(guān)于ES6入門學(xué)習(xí)中Iterator與for...of循環(huán)的相關(guān)資料,不足之處還望大家多多指正,需要的朋友們可以參考學(xué)習(xí)。2017-05-05微信小程序使用websocket通訊的demo,含前后端代碼,親測可用
這篇文章主要介紹了微信小程序使用websocket通訊的demo,含前后端代碼,親測可用,需要的朋友可以參考下2019-05-05根據(jù)user-agent判斷蜘蛛代碼黑帽跳轉(zhuǎn)代碼(js版與php版本)
這篇文章主要介紹了根據(jù)user-agent判斷蜘蛛代碼黑帽跳轉(zhuǎn)代碼(js版與php版本),需要的朋友可以參考下2015-09-09Javascript實(shí)現(xiàn)滑塊滑動(dòng)改變值的實(shí)現(xiàn)代碼
一個(gè)關(guān)于稅務(wù)的功能,值得一說的是本頁面的滑塊實(shí)現(xiàn)由于對美工不是很熟悉所以上圖了,感興趣的朋友可以了解下哈2013-04-04