欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

對Web開發(fā)中前端框架與前端類庫的一些思考

 更新時間:2015年03月27日 17:02:51   投稿:junjie  
這篇文章主要介紹了對Web開發(fā)中前端框架與前端類庫的一些思考,本文講解了前端框架的理解誤區(qū)、前端框架與前端類庫的區(qū)別、前端MVC框架思想等內(nèi)容,需要的朋友可以參考下

說起前端框架,我也是醉了?,F(xiàn)在去面試或者和同行聊天,動不動就這個框架碉堡了,那個框架好犀利。

  當(dāng)然不是貶低框架,只是有一種殺雞焉用牛刀的感覺。網(wǎng)站技術(shù)是為業(yè)務(wù)而存在的,除此毫無意義,框架也是一樣。在技術(shù)選型和架構(gòu)設(shè)計當(dāng)中,脫離網(wǎng)站業(yè)務(wù)發(fā)展的實際,一味的追求時髦新技術(shù),可能會適得其反,將網(wǎng)站發(fā)展引入崎嶇小道。就好像一個日均pv只有幾百的小型電商網(wǎng)站,卻要大喊“某寶就是這么搞的”,然后搭建應(yīng)用服務(wù)器集群,使用分布式文件系統(tǒng)和分布式數(shù)據(jù)庫系統(tǒng)...等巴拉巴拉的一堆用來處理高并發(fā),海量數(shù)據(jù)訪問的手段。我想說,有意義嗎?

前端框架的理解誤區(qū)

  網(wǎng)站的價值在于它能為用戶提供什么價值,在于網(wǎng)站能做什么,而不在于它是怎么做的,所以在網(wǎng)站還很小的時候就去追求網(wǎng)站的架構(gòu)框架是舍本逐末,得不償失的。前端框架同理,如果是一個簡單的頁面型產(chǎn)品,應(yīng)用只是依賴服務(wù)器來生成Web頁面和視圖,并且只需要使用一些簡單的Javascript或者JQuery來使應(yīng)用更加具有互動性,那么一個JQuery前端類庫就可以了,真的沒必要用上一些高大上的框架。

  當(dāng)然,框架的確是很有用的,重點是我們要知道什么時候該用什么框架。大公司大項目的經(jīng)驗和成功模式固然重要,值得學(xué)習(xí)借鑒,但我們不能因此變得盲從。只有深刻去理解前端框架,知道什么時候該用什么什么框架解決什么問題,才能有的放矢,直擊要害。

前端框架與前端類庫的區(qū)別

  使用框架前,我覺得很重要的一點是弄清類庫(諸如JQuery)和框架(諸如angularJS)的區(qū)別在何處。

  簡單而言,類庫,解決的是代碼或者是模塊級別的復(fù)用或者對復(fù)雜度的封裝問題,例如將一個解決復(fù)雜問題的功能模塊封裝成一個函數(shù),提供一個簡單的接口。庫它是一種工具,它提供了很多封裝好的方法,用與不用取決于我們自身,即使用了也不會影響我們呢的代碼結(jié)構(gòu)。

  而框架,更多的是對模式級別的復(fù)用和對程序組織的規(guī)范。這里的模式是指比如MVC,為了實現(xiàn)M和V的解耦,把復(fù)雜的耦合關(guān)系由經(jīng)常變化的業(yè)務(wù)代碼轉(zhuǎn)移到不經(jīng)常變化的框架內(nèi)部消化。是面向一個領(lǐng)域來提供一套解決方案,提高開發(fā)效率,如果我們選擇了使用某框架,就應(yīng)該遵循該框架所規(guī)定的規(guī)則。

  二者最主要的區(qū)別是:JQuery以DOM操作為中心,框架,準(zhǔn)確來說是MVC框架,是以模型(model)為中心,而DOM操作是附加的。所以,以模型為中心最終達(dá)到的目的是帶來一整套工作流程的變更,使得后臺工程師可以編寫前端的模型代碼,把后臺與前端打通,交互設(shè)計師處理UI跟模型的互動關(guān)系,UI設(shè)計師可以專注、無障礙的處理HTML源碼,把它們以界面模板的形式提交給交互工程師。這一整套協(xié)作機(jī)制能大大提高開發(fā)效率。使用MVC框架使得前端任務(wù)更好的被解耦。

前端MVC框架思想

  我們知道,傳統(tǒng)的MVC模式將一個應(yīng)用劃分為——模型層(model)、視圖層(view)、控制層(controller)。他們在應(yīng)用系統(tǒng)中擔(dān)當(dāng)不同的角色,完成不同的任務(wù)。

Model:即數(shù)據(jù)模型,用來包裝和應(yīng)用程序的業(yè)務(wù)邏輯相關(guān)的數(shù)據(jù)或者對數(shù)據(jù)進(jìn)行處理,模型可以直接訪問數(shù)據(jù)。

View:視圖用來有目的顯示數(shù)據(jù),在視圖中一般沒有程序上的邏輯,為了實現(xiàn)視圖上的最新功能,視圖需要訪問它監(jiān)視的數(shù)據(jù)模型。

Controller:控制器調(diào)控模型和視圖的聯(lián)系,它控制應(yīng)用程序的流程,處理事件并作出響應(yīng),事件不僅僅包括用戶的行為還有數(shù)據(jù)模型上的改變。通過捕獲用戶事件,通知模型層作出相應(yīng)的更新處理,同時將模型層的更新和改變通知給視圖,使得視圖作出相應(yīng)改變。因此控制器保證了視圖和模型的一致性。

我對前端的View的理解是,與頁面上元素直接相關(guān)的部分都屬于View。包括html,CSS和一部分直接控制頁面元素的JS??梢詮腗odel中得到數(shù)據(jù),并將其顯示到頁面上。而關(guān)于數(shù)據(jù)的變更與請求,則統(tǒng)統(tǒng)交給Controller處理。

  那么Controller呢?作為Model和View的粘合劑,Controller將View方面的請求轉(zhuǎn)發(fā)給合適的Model,在必要時也會去更新View。而Controller本身也可以作為Model的觀察者,獲取Model的變更。而作為Controller本身,就不應(yīng)該有涉及到頁面元素的代碼了。

  最后談?wù)凪odel,與后端的溝通、AJAX請求以及對數(shù)據(jù)的處理都屬于Model的工作。Model本身不知道誰是View,誰是Controller。它只提供一些方法供View和Controller調(diào)用,并且將變更通知給它的觀察者View或Controller。顯然,Model與頁面元素之間也解耦了。

  雖然基于MVC模型的框架之間也有很多不同之處,但是總體而言,Model負(fù)責(zé)保存vier需要的數(shù)據(jù)以及數(shù)據(jù)處理邏輯,例如讀寫,更新,刪除,驗證,轉(zhuǎn)換等。View負(fù)責(zé)接收并顯示Model提供的數(shù)據(jù)以及接收用戶的輸入,并且響應(yīng)事件,Model更新后及時將更新反饋回用戶。Controller處理業(yè)務(wù)邏輯和事件邏輯。

知己知彼,對癥下藥

  在前端框架和類庫越來越豐富的今天。選擇一款對的框架或類庫就顯得尤為重要了,我覺得沒必要盲目跟風(fēng),看見什么框架火就屁顛屁顛跑去啃一個星期,然后因為項目工作上用不到,幾個月之后又全忘光了。

  所以我覺得重要的是把基礎(chǔ)打扎實,重點是去了解各個類庫與框架的作用,某類框架著重用于解決什么問題,然后在項目需要用到時候再去研讀API才是上策。

  最后,我們要清楚MVC在前端開發(fā)中的應(yīng)用具有的局限性,簡單的項目如果使用MVC框架會可能導(dǎo)致項目變得更加復(fù)雜。當(dāng)然隨著Web前端的復(fù)雜度不斷增加,前端MVC框架的不斷發(fā)展,相信在未來的應(yīng)用軟件類復(fù)雜產(chǎn)品當(dāng)中,MVC框架一定會給前端工作帶來效率上的飛躍。

  以上只是我對前端框架和類庫一些淺顯的認(rèn)識,不喜勿噴,更希望您能提出更好的學(xué)習(xí)框架和類庫的方法。共同進(jìn)步,共同學(xué)習(xí)。

  文中若有技術(shù)層面的錯誤還請斧正,誤人子弟實乃罪過。

相關(guān)文章

  • JS的函數(shù)調(diào)用棧stack size的計算方法

    JS的函數(shù)調(diào)用棧stack size的計算方法

    本篇文章給大家分享了關(guān)于JS的函數(shù)調(diào)用棧stack size的計算方法的相關(guān)知識點,有興趣的朋友參考學(xué)習(xí)下。
    2018-06-06
  • 微信小程序頁面間跳轉(zhuǎn)傳參方式總結(jié)

    微信小程序頁面間跳轉(zhuǎn)傳參方式總結(jié)

    這篇文章主要給大家總結(jié)介紹了關(guān)于微信小程序頁面間跳轉(zhuǎn)傳參方式,文中通過示例代碼介紹的非常詳細(xì),對大家學(xué)習(xí)或者使用小程序具有一定的參考學(xué)習(xí)價值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-06-06
  • Javascript的原型和原型鏈你了解嗎

    Javascript的原型和原型鏈你了解嗎

    這篇文章主要為大家詳細(xì)介紹了Javascript的原型和原型鏈,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來幫助
    2022-03-03
  • JS實現(xiàn)頁面數(shù)據(jù)無限加載

    JS實現(xiàn)頁面數(shù)據(jù)無限加載

    這篇文章主要為大家詳細(xì)介紹了JS實現(xiàn)頁面數(shù)據(jù)無限加載,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-09-09
  • JS不同運算符下隱式類型轉(zhuǎn)換的實現(xiàn)示例

    JS不同運算符下隱式類型轉(zhuǎn)換的實現(xiàn)示例

    隱式轉(zhuǎn)換就是自動轉(zhuǎn)換,通常發(fā)生在一些數(shù)學(xué)運算中,本文就來介紹一下JS不同運算符下隱式類型轉(zhuǎn)換的實現(xiàn)示例,具有一定的參考價值,感興趣的可以了解一下
    2023-12-12
  • Java通過WebSocket實現(xiàn)異步導(dǎo)出解決思路

    Java通過WebSocket實現(xiàn)異步導(dǎo)出解決思路

    這篇文章主要介紹了通過WebSocket實現(xiàn)異步導(dǎo)出,本篇文章記錄大批量數(shù)據(jù)導(dǎo)出時間過長,導(dǎo)致接口請求超時問題,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2024-01-01
  • JavaScript+H5實現(xiàn)微信搖一搖功能

    JavaScript+H5實現(xiàn)微信搖一搖功能

    這篇文章主要為大家詳細(xì)介紹了JavaScript+H5實現(xiàn)微信搖一搖功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2018-05-05
  • javascript實現(xiàn)起伏的水波背景效果

    javascript實現(xiàn)起伏的水波背景效果

    這篇文章主要為大家詳細(xì)介紹了javascript實現(xiàn)起伏的水波背景效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-05-05
  • 淺談js函數(shù)的多種定義方法與區(qū)別

    淺談js函數(shù)的多種定義方法與區(qū)別

    下面小編就為大家?guī)硪黄獪\談js函數(shù)的多種定義方法與區(qū)別。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2016-11-11
  • 原生javascript實現(xiàn)圖片輪播切換效果

    原生javascript實現(xiàn)圖片輪播切換效果

    這篇文章主要為大家詳細(xì)介紹了原生javascript實現(xiàn)圖片輪播切換效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2022-07-07

最新評論