這篇文章主要介紹了對(duì)javascript客戶(hù)端應(yīng)用編程的一些建議,主要針對(duì)mvc框架框架的一些相關(guān)使用問(wèn)題,需要的朋友可以參考下你可能注意到了，最近的一段時(shí)間越來(lái)越多的web應(yīng)用有變復(fù)雜的趨勢(shì)，重心從服務(wù)端慢慢向著客戶(hù)端轉(zhuǎn)移。

這是個(gè)正常的趨勢(shì)么?我不知道。支持和反對(duì)者的討論就像是在討論復(fù)活者和圣誕節(jié)哪一個(gè)更好一樣; 很難說(shuō)哪一方觀點(diǎn)就是完全正確的。

因此，本文不會(huì)探討究竟哪一方是對(duì)的，不過(guò)我還是試圖解釋一下使用大家所熟知的面向?qū)ο缶幊桃苍S可以成功的解決客戶(hù)端編程中存在的一些問(wèn)題。不太規(guī)范的代碼的示例為了顧及一個(gè)應(yīng)用的響應(yīng)以及用戶(hù)體驗(yàn), 導(dǎo)致我們創(chuàng)建了持續(xù)增長(zhǎng)的復(fù)雜的代碼, 這些代碼變得難于理解和維護(hù)。

你可以輕松的想到在沒(méi)有任何構(gòu)架和遵循規(guī)則構(gòu)建出客戶(hù)端的javascript應(yīng)用代碼將會(huì)這樣: ?

維護(hù)這一類(lèi)的代碼將會(huì)很難。因?yàn)檫@短短的一段代碼與很多地方都有關(guān)聯(lián): 它控制著很多的事件 (站點(diǎn), 用戶(hù), 網(wǎng)絡(luò)事件), 它要處理用戶(hù)的操作事件, 要解析服務(wù)器返回的應(yīng)答并且產(chǎn)生html代碼。 有人可能說(shuō): “是的，你說(shuō)的對(duì)， 但是如果這不是一個(gè)客戶(hù)端單頁(yè)的頁(yè)面應(yīng)用?這最多算是一次過(guò)度使用jquery類(lèi)庫(kù)的例子” ——不是很有說(shuō)服力的觀點(diǎn), 因?yàn)楸娝苤?，易于維護(hù)和精心設(shè)計(jì)的代碼是非常重要的。特別是許多的工具或者是框架致力于保持代碼可用以便于我們能更簡(jiǎn)單的去測(cè)試、維護(hù)、重用、和擴(kuò)展它。

mvc是什么?

談到這里。我們能受益于那些基于mvc的javascript框架，但這些框架大部分不使用mvc，并且相當(dāng)于model和videw的一種結(jié)合，或者在二都之間的一些東西，這很難去分清。這就是為什么說(shuō)大部分的javascript框架是基于mv*。

改變方法或許可以提供項(xiàng)目中客戶(hù)端的組織和架構(gòu)，這使得代碼可以在很長(zhǎng)的一段時(shí)間內(nèi)容易維護(hù)，即使重構(gòu)已經(jīng)有的代碼也變得相對(duì)容易。知道他如何工作和下面一些問(wèn)題的答案是必需要要記住的。

我的應(yīng)用里有哪些類(lèi)型的數(shù)據(jù)?-model

用戶(hù)應(yīng)該看到什么?-view

誰(shuí)是和用戶(hù)交互的程序?-controller

使用mvc框架重構(gòu)代碼

受用mvc重構(gòu)代碼有什么好處?

解除dom和ajax的依賴(lài)

代碼有更好的結(jié)構(gòu)，并且更容易測(cè)試。

從 $(document).ready()中刪除多余的代碼,只留下使用model創(chuàng)建links的部分。

讓我們使用一些簡(jiǎn)單步驟來(lái)重構(gòu)一個(gè)典型的代碼塊

步驟 1: 創(chuàng)建視圖并移動(dòng)ajax請(qǐng)求

我們開(kāi)始解除dom和ajax的依賴(lài). 使用prototypes建造者,模式創(chuàng)建'animals' 對(duì)象，并且添加一個(gè) 'add' 方法.同時(shí)創(chuàng)建視圖 'newanimalview' , 并且添加方法'addanimal'、 'appendanimal' 、'clearinput'.

代碼如下:

?

更多信息請(qǐng)查看IT技術(shù)專(zhuān)欄