javascript原型模式用法實(shí)例詳解
本文實(shí)例講述了javascript原型模式用法。分享給大家供大家參考。具體分析如下:
一般在了解了工廠模式和構(gòu)造函數(shù)模式的弊端之后,就知道為什么需要原型模式了
原型模式i的定義:每個(gè)函數(shù)都有一個(gè)prototype(原型)屬性,這個(gè)屬性是一個(gè)對(duì)象,它的用途是包含可以由特定類型的所有實(shí)例共享的屬性和方法。比如在構(gòu)造函數(shù)模型中sayInformation()方法,如果聲明兩個(gè)實(shí)例就要構(gòu)造兩次sayInformation方法,但是聲明兩次是沒(méi)有必要的,這就是為什么有原型模式的出現(xiàn)(尼瑪,網(wǎng)上那些博客上面都是扯談的東西,還是看書講的容易理解),sayInformation()聲明為原型模式之后,實(shí)例就共享了,就沒(méi)有必要聲明兩次了
function Person(){}
Person.prototype.name="jack";
Person.prototype.age=10;
Person.prototype.sayInformation=function()
{
console.log("my name is"+this.name+" age is"+this.age);
}
var person1 = new Person();
person1.sayInformation();
console.info(person1.name);
//來(lái)自原型的屬性name
person1.name="Greg";
//修改實(shí)例的name屬性
console.info(person1.name);
//來(lái)自實(shí)例的屬性name
delete person1.name ;
//來(lái)自實(shí)例的屬性,這里刪除的是實(shí)例的屬性,但是原型的屬性依然存在
console.info(person1.name);
//來(lái)自原型的屬性name
var person2 = new Person();
person2.sayInformation();
console.info(person1.hasOwnProperty("name"));
//hasOwnProperty檢查屬性是屬于實(shí)例還是原型中,如果是實(shí)例中就返回true
console.info(person1.name==person2.name);
console.info(person1.sayInformation==person2.sayInformation);
console.info(person1.constructor);
//指向person1的構(gòu)造函數(shù)
//原型更加簡(jiǎn)便的寫法
function Person2(){}
Person2.prototype={
name:"jack",
age:29,
sayInformationfunction:function()
{
console.log("my name is"+this.name+" age is"+this.age);
}
}
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
- javascript設(shè)計(jì)模式 – 原型模式原理與應(yīng)用實(shí)例分析
- 深入了解js原型模式
- JavaScript創(chuàng)建對(duì)象方式總結(jié)【工廠模式、構(gòu)造函數(shù)模式、原型模式等】
- 詳解js產(chǎn)生對(duì)象的3種基本方式(工廠模式,構(gòu)造函數(shù)模式,原型模式)
- js面向?qū)ο笾R?jiàn)創(chuàng)建對(duì)象的幾種方式(工廠模式、構(gòu)造函數(shù)模式、原型模式)
- javascript組合使用構(gòu)造函數(shù)模式和原型模式實(shí)例
- 深入理解JavaScript系列(42):設(shè)計(jì)模式之原型模式詳解
- JavaScript設(shè)計(jì)模式之原型模式(Object.create與prototype)介紹
- JS面向?qū)ο蠡A(chǔ)講解(工廠模式、構(gòu)造函數(shù)模式、原型模式、混合模式、動(dòng)態(tài)原型模式)
- 怎樣用JavaScript實(shí)現(xiàn)原型模式
相關(guān)文章
JS 退出系統(tǒng)并跳轉(zhuǎn)到登錄界面的實(shí)現(xiàn)代碼
這篇文章介紹了退出系統(tǒng)后跳轉(zhuǎn)到登陸頁(yè)面的簡(jiǎn)單JS代碼,有需要的朋友可以參考一下2013-06-06
基于javascript實(shí)現(xiàn)圖片懶加載
這篇文章主要介紹了javascript實(shí)現(xiàn)圖片懶加載的方法及思路,有時(shí)我們需要用懶加載,也就是延遲加載圖片的方式,來(lái)提高網(wǎng)站的親和力,需要的朋友可以參考下2016-01-01
from 表單提交返回值用post或者是get方法實(shí)現(xiàn)
from 表單提交的返回值可以用jquery的post或者是get方法去實(shí)現(xiàn),具體如下,感興趣的朋友可以參考下,希望對(duì)大家有所幫助2013-08-08
JS實(shí)現(xiàn)的簡(jiǎn)單表單驗(yàn)證功能示例
這篇文章主要介紹了JS實(shí)現(xiàn)的簡(jiǎn)單表單驗(yàn)證功能,涉及javascript針對(duì)表單提交內(nèi)容的獲取、判斷、焦點(diǎn)設(shè)置等相關(guān)操作技巧,需要的朋友可以參考下2017-10-10
收集的一些Array及String原型對(duì)象的擴(kuò)展實(shí)現(xiàn)代碼
收集的一些Array及String原型對(duì)象的擴(kuò)展實(shí)現(xiàn)代碼,學(xué)習(xí)js的朋友可以參考下。并可以自定義的對(duì)字符串與array數(shù)據(jù),進(jìn)行擴(kuò)展。2010-12-12
javascript createAdder函數(shù)功能與使用說(shuō)明
createAdder(x)是一個(gè)函數(shù),返回一個(gè)函數(shù)。在JavaScript中,函數(shù)是第一類對(duì)象:另外它們可以被傳遞到其他函數(shù)作為參數(shù)和函數(shù)返回。在這種情況下,函數(shù)返回本身就是一個(gè)函數(shù)接受一個(gè)參數(shù),并增加了一些東西。2010-06-06
JavaScript中l(wèi)ayer關(guān)閉指定彈出窗口方法總結(jié)
這篇文章主要給大家介紹了關(guān)于JavaScript中l(wèi)ayer關(guān)閉指定彈出窗口方法的相關(guān)資料,layer是layui的一個(gè)彈出層組件,但是可以作為獨(dú)立組件使用,需要的朋友可以參考下2023-10-10
一文概述ES7~12的語(yǔ)法及其相關(guān)使用規(guī)則
隨著JavaScript這門語(yǔ)言越來(lái)越流行,使得JavaScript這門語(yǔ)言越來(lái)越完善,這篇文章主要介紹了一文概述ES7~12的語(yǔ)法及其相關(guān)使用規(guī)則,需要的朋友可以參考下2023-01-01
七個(gè)基于JavaScript實(shí)現(xiàn)的情人節(jié)表白特效
情人節(jié)將至 程序員證明自己不是直男的時(shí)候到啦 我們也有自己的專屬代碼浪漫。本文將介紹七個(gè)利用JavaScript實(shí)現(xiàn)的情人節(jié)表白特效,需要的可以參考一下2022-01-01
javascript實(shí)現(xiàn)的文字加密解密
javascript實(shí)現(xiàn)的文字加密解密...2007-06-06

