摘要:所以讓我們趕緊切入正題,一起來看看關(guān)于腳本的面向?qū)ο缶幊?。所以下面讓我們用這些特性重新寫一下上面實(shí)現(xiàn)的函數(shù),看一下更原汁原味的面向?qū)ο缶幊獭?/p>
今天懷著忐忑的心情寫下這篇文章,因?yàn)檫@畢竟是我第一篇真正意義上的技術(shù)文章,鞏固知識的同時(shí),希望可以給閱讀的人帶來收獲,就很滿足了。所以讓我們趕緊切入正題,一起來看看關(guān)于Java腳本的面向?qū)ο缶幊獭?/p>
如果你沒什么問題的看到這里,我會有一絲淡淡的憂傷,因?yàn)?b>JavaScript就是JavaScript,和Java沒半毛錢的關(guān)系,如果有的話,那也就有0.1分錢的關(guān)系,是的,就0.1分錢!想起幾個(gè)月前我偶然看到 Johnhax 的 ppt ,看完之后,我發(fā)現(xiàn)我周圍的世界和以前不那么一樣了,沒錯(cuò),ppt改變?nèi)松墓适掳l(fā)生在了我的身上,從此我對JavaScript愛的更加深沉,哈哈哈......
華麗麗的分割線
如果你還不熟悉原型鏈和參數(shù)this的綁定機(jī)制,建議你花一些時(shí)間了解一下它們。
現(xiàn)在讓我們走進(jìn)`JavaScript`面向?qū)ο缶幊痰氖澜?,那么什么是面向?qū)ο缶幊棠兀?/p>
面向?qū)ο蟪绦蛟O(shè)計(jì)(英語:Object-oriented programming,縮寫:OOP)是種具有對象概念的程序編程范型,同時(shí)也是一種程序開發(fā)的方法。它可能包含數(shù)據(jù)、屬性、代碼與方法。對象則指的是類的實(shí)例。它將對象作為程序的基本單元,將程序和數(shù)據(jù)封裝其中,以提高軟件的重用性、靈活性和擴(kuò)展性,對象里的程序可以訪問及經(jīng)常修改對象相關(guān)連的數(shù)據(jù)。在面向?qū)ο蟪绦蚓幊汤?,?jì)算機(jī)程序會被設(shè)計(jì)成彼此相關(guān)的對象(from wiki)
wiki描述好抽象,不想看了,那究竟什么是面向?qū)ο竽??下面讓我們來看一個(gè)例子,quoniammm同學(xué)很愛玩游戲,有一天他想設(shè)計(jì)一款簡單的游戲打發(fā)時(shí)間,叫究極進(jìn)化白金版的會飛的小鳥(改良版的flappy bird),游戲中多了很多不同屬性的管道來阻止小鳥的前進(jìn)。有紅色的、藍(lán)色的、紫色的、會噴火的、會噴水的、可以上下移動的、快速的、慢速的......各種各樣的水管,于是quoniammm同學(xué)為每個(gè)水管寫了一個(gè)函數(shù),還不錯(cuò),游戲可以正常運(yùn)行。玩了幾次后,quoniammm同學(xué)把游戲放在了一邊。幾周后,quoniammm同學(xué)又把這個(gè)游戲拿出來玩,發(fā)現(xiàn)那個(gè)快速移動的藍(lán)色的會噴火的管子好難飛過去,手殘的他不想再受虐了,決定修改一下這個(gè)fastmoveblueFirePump函數(shù),可是打開代碼,他一臉懵逼,有如此多相似的函數(shù),一大堆代碼,好暈,作為一個(gè)有原則的人,他也不想被代碼虐了,因此他決定重構(gòu)這段代碼了,恰好最近學(xué)習(xí)了面向?qū)ο?,這是命運(yùn)的決定讓quoniammm同學(xué)用面向?qū)ο蟮乃枷雭碇貥?gòu)這段代碼。
于是他寫了一個(gè) Pump 函數(shù),這個(gè)函數(shù)有一個(gè) methods 屬性:
var Pump = function(color) { var obj = Object.create(Pump.methods); obj.color = color || "green"; return obj; } Pump.methods = { //用來實(shí)現(xiàn)點(diǎn)擊水管變色的功能 draw: function(color) { ... this.color = color; ... } //...... } var greenPump = Pump(); var redPump = Pump("red"); var blackPump = Pump("black");
仔細(xì)的從上到下閱讀這段代碼,發(fā)現(xiàn)這段代碼更加方便的生成了各種各樣不同顏色的水管,quoniammm同學(xué)很滿意,代碼量被減少了,可是想到還要構(gòu)建紅色的噴火函數(shù),藍(lán)色的噴水函數(shù)......quoniammm同學(xué)有開始郁悶了,看來重構(gòu)還得繼續(xù)下去。于是quoniammm同學(xué)開始思考,既然 Pump 函數(shù)可以方便的實(shí)現(xiàn)制造各種各樣顏色的管子,那么可以實(shí)現(xiàn)一個(gè) waterPump 函數(shù)實(shí)現(xiàn)制造可以噴水的管子,可是噴水的管子也有各種各樣的顏色,怎么能把 Pump 和 waterPump 聯(lián)系起來呢,讓僅僅調(diào)用 waterPump 函數(shù)就可以實(shí)現(xiàn)制造各種各樣顏色的噴水管子呢?于是機(jī)智的quoniammm同學(xué)實(shí)現(xiàn)了下面的代碼:
var waterPump = function(color) { var obj = Pump(color); obj.water = function() { //... }; return obj; } //制造出了紅色的噴水管子 var redwaterPump = waterPump("red");
寫完這段代碼后,quoniammm同學(xué)又花了半天時(shí)間按照上面的思路重構(gòu)了整個(gè)游戲代碼,降低了那個(gè)讓他惱火的快速移動的藍(lán)色的會噴火的管子的難度,于是他又可以愉快地玩耍了,打發(fā)這令人絕望的無聊時(shí)光。
文章寫到這里,quoniammm同學(xué)去睡覺了,所以接結(jié)束了嗎?當(dāng)然還沒有,還記得之前我提到的原型和參數(shù) this 的綁定機(jī)制,這些都是 javascript 的特性。所以下面讓我們用這些特性重新寫一下上面實(shí)現(xiàn)的函數(shù),看一下更原汁原味的 javascript 面向?qū)ο缶幊獭?/p>
var Pump = function(color) { this.color = color || "green"; } Pump.prototype.draw = function(color) { ... this.color = color; ... } var greenPump = new Pump(); var redPump = new Pump("red"); var blackPump = new Pump("black");
//function waterPump var waterPump = function(color) { Pump.call(this, color); } waterPump.prototype = Object.create(Pump.prototype); waterPump.prototype.water = funciton() { //... } var redwaterPump = new waterPump("red");
文章到這里已接近尾聲,今天我們簡單的了解了 javascript 的面向?qū)ο缶幊?,最后用比較官方的話總結(jié)一下,并提出一些問題供大家思考,希望對大家能有所幫助。
今天我們實(shí)現(xiàn)了一個(gè)父類函數(shù) Pump,有 color 屬性和 draw 方法,并實(shí)現(xiàn)了繼承父類 Pump 的子類函數(shù) waterPump,它自身實(shí)現(xiàn)了一個(gè) water 方法。
Q&A:waterPump.prototype = Object.create(Pump.prototype) 這段代碼我們也可以用 Object.setPrototype(waterPump.prototype, Pump.prototype) 替換,兩者有什么區(qū)別呢?
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/91048.html
摘要:請記住,這些書中的一些可能不是最新的,但概念和基礎(chǔ)仍應(yīng)適用。是最好的老師之一。的秘密由部分組成。在你完成這些書后,查看書籍和最好的本土?xí)? 我看過三本,第1本,第二本,第四本。第一本買的的實(shí)體書,其他兩本看的是電子書。第一本是大名鼎鼎老道寫的,書很薄,但是非常經(jīng)典。javascirpt忍者秘籍是jquery的作者寫的,也是非常經(jīng)典。you dont kown js系列也是非常好??戳?..
摘要:設(shè)計(jì)模式是以面向?qū)ο缶幊虨榛A(chǔ)的,的面向?qū)ο缶幊毯蛡鹘y(tǒng)的的面向?qū)ο缶幊逃行┎顒e,這讓我一開始接觸的時(shí)候感到十分痛苦,但是這只能靠自己慢慢積累慢慢思考。想繼續(xù)了解設(shè)計(jì)模式必須要先搞懂面向?qū)ο缶幊?,否則只會讓你自己更痛苦。 JavaScript 中的構(gòu)造函數(shù) 學(xué)習(xí)總結(jié)。知識只有分享才有存在的意義。 是時(shí)候替換你的 for 循環(huán)大法了~ 《小分享》JavaScript中數(shù)組的那些迭代方法~ ...
摘要:是完全的面向?qū)ο笳Z言,它們通過類的形式組織函數(shù)和變量,使之不能脫離對象存在。而在基于原型的面向?qū)ο蠓绞街?,對象則是依靠構(gòu)造器利用原型構(gòu)造出來的。 JavaScript 函數(shù)式腳本語言特性以及其看似隨意的編寫風(fēng)格,導(dǎo)致長期以來人們對這一門語言的誤解,即認(rèn)為 JavaScript 不是一門面向?qū)ο蟮恼Z言,或者只是部分具備一些面向?qū)ο蟮奶卣鳌1疚膶⒒貧w面向?qū)ο蟊疽?,從對語言感悟的角度闡述為什...
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對象。對象就是數(shù)據(jù),對象本身不包含方法。類是相似對象的描述,稱為類的定義,是該類對象的藍(lán)圖或原型。在中,對象通過對類的實(shí)體化形成的對象。一類的對象抽取出來。注意中,對象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對象。對象就是數(shù)據(jù),對象本身不包含方法。類是相似對象的描述,稱為類的定義,是該類對象的藍(lán)圖或原型。在中,對象通過對類的實(shí)體化形成的對象。一類的對象抽取出來。注意中,對象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
閱讀 2483·2021-09-22 15:27
閱讀 3254·2021-09-03 10:32
閱讀 3558·2021-09-01 11:38
閱讀 2537·2019-08-30 15:56
閱讀 2255·2019-08-30 13:01
閱讀 1575·2019-08-29 12:13
閱讀 1460·2019-08-26 13:33
閱讀 931·2019-08-26 13:30