過年的時(shí)候和表哥聊天，他說(shuō)以前也用html，js，css寫過網(wǎng)頁(yè)，那現(xiàn)在的前端和那個(gè)時(shí)候有什么不同，我當(dāng)時(shí)就向他介紹了一下前端。

但是當(dāng)時(shí)我對(duì)前端的理解也不是很透徹，所以我自我感覺也沒有介紹清楚。

隨著我自己學(xué)習(xí)的深入，我自己覺得有必要總結(jié)一篇前端和寫網(wǎng)頁(yè)不同的博文了。同時(shí)也為了記錄下我現(xiàn)在的見解和認(rèn)識(shí)，等過一段時(shí)間回過頭來(lái)在看，肯定會(huì)對(duì)自己的提高有很多感悟。

由于知識(shí)水平實(shí)在有限，如果有什么錯(cuò)誤，麻煩在評(píng)論區(qū)中指出，謝謝！

網(wǎng)頁(yè)開發(fā)時(shí)代

那個(gè)時(shí)候，人們通過html寫網(wǎng)頁(yè)，并且用js，css調(diào)整樣式。

我們?cè)诟鞣N經(jīng)典書籍《Head First HTML與CSS》《精通CSS：高級(jí)Web標(biāo)準(zhǔn)解決方案》《JavaScript高級(jí)程序設(shè)計(jì)》里面學(xué)到的，也基本是這方面的東西。慕課網(wǎng)上的大部分視屏，也都僅限于這方面而已。

網(wǎng)頁(yè)模板時(shí)代

隨著網(wǎng)頁(yè)的復(fù)雜度加大，程序員為了開發(fā)上的便利，于是開發(fā)各種網(wǎng)頁(yè)模板語(yǔ)言。

比如說(shuō)簡(jiǎn)化寫css的less語(yǔ)言，簡(jiǎn)化寫js的coffeejs，還有很多html和js混寫的各種模板。

ajax時(shí)代

隨著js的發(fā)展，XHR的發(fā)明使得程序員可以在前端處理數(shù)據(jù)，分擔(dān)了一些后端的工作。

很好的例子是表單驗(yàn)證啊，瀏覽器滑塊滑到底部才開始加載圖片啊什么的。

SPA時(shí)代

SPA=Single Page Application單頁(yè)面應(yīng)用。

隨著ajax的發(fā)展，人們?cè)跒g覽器端就可以做數(shù)據(jù)處理，這就意味著前端可以寫一整個(gè)應(yīng)用程序，即SPA。

在SPA時(shí)代，程序員用js來(lái)處理整個(gè)前端部分，用戶在打開網(wǎng)站的時(shí)候就下載所有的js，在以后的打開頁(yè)面等交互中，就直接在瀏覽器端用js進(jìn)行處理，不需要向服務(wù)端發(fā)送http請(qǐng)求。

這個(gè)時(shí)候有一個(gè)很重要的概念就是路由，由于打開頁(yè)面不發(fā)送http請(qǐng)求，所以對(duì)于一個(gè)網(wǎng)址，需要瀏覽器不知道怎么辦。這個(gè)時(shí)候需要有一種機(jī)制來(lái)指導(dǎo)瀏覽器對(duì)于什么網(wǎng)址打開什么內(nèi)容，這就是路由。

MVC時(shí)代

隨著SPA時(shí)代的發(fā)展，人們?yōu)榱碎_發(fā)的方便，經(jīng)常把項(xiàng)目分為各種模塊。其中最典型的是MVC，即model，view和control。

這個(gè)時(shí)代涌現(xiàn)出各種框架，比如backbone框架等。

MVVM時(shí)代

由于MVC的control模塊一般是由服務(wù)端處理的，這不屬于前端的內(nèi)容。為了解決這個(gè)問題，人們提出了一種解決辦法，就是利用view model來(lái)代替control，這就是MVVM框架的由來(lái)。實(shí)現(xiàn)的技術(shù)叫做雙向綁定。

這個(gè)時(shí)代就出現(xiàn)了現(xiàn)代前端框架：reactjs,angularjs等。這個(gè)時(shí)候，前端工程師已經(jīng)可以開發(fā)在瀏覽器上運(yùn)行的和應(yīng)用軟件一樣的軟件了，包括在手機(jī)瀏覽器上運(yùn)行的。

相信看了這些案例你已經(jīng)掌握了方法，更多精彩請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！

相關(guān)閱讀：

實(shí)現(xiàn)瀑布流布局的倆種方法

詳解瀏覽器渲染流程

overflow的滾動(dòng)有哪些重要性

HTML中移動(dòng)端有哪些布局方案

以上就是什么是前端的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！