零基礎前端入門，真正難在哪裏？簡說編程思想和邏輯思惟

不少同窗跟我說，學前端學的很迷茫，

就這樣，問他爲啥迷茫吧，說也說不出來啥具體的。就是也學了一堆東西，也確實都是前端開發工做當中要用的。但依然不知道前路如何。

這裏就有一個「前端入門的標準」的問題。什麼纔是真正的前端入門？

一、是你學了一堆的前端開發技術嗎？

二、是你作了幾個前端的大小不一的例子嗎？

三、是你已經作了一二年的前端開發工做了嗎？

不要奇怪我把第三條也列上，確實有人已經工做了二三年了，但其實依然沒有入門前端開發。

我我的主觀認爲，判斷一我的是否已經入門前端開發，有二個標準，

一、學了一堆的前端開發技術，如今的大大小小的培訓機構基本都是這麼作的；

二、掌握並理解「編程思路與邏輯思惟」；

我我的更喜歡第二個，就是掌握「編程思想與開發邏輯」的人。

什麼叫編程思想呢？

很簡單，其實就是提煉特徵。例如，一筐蘋果吧，把它的特徵提煉出來，就這樣，

蘋果

_顏色：紅

_形狀：圓

_大小：200mm

_重量：100克

_品質：100%

_數量：100

那麼，用JavaScript來表示，就是這樣，

var _appleObj = {

color:'#f00',

shape:circular,

size:200,

weight:100,

quality:100%,

number:100

}

這個過程是什麼呢？

對具體事物的抽象，在這個過程當中只提取出目標對象中咱們所須要的特徵。而後在代碼中表達出來。這裏面的關鍵是，理解蘋果的【顏色】和_appleObj中的【color】，它們兩者之間的對應關係。

再，

例以下面這個京東的購物車，我隨便添加了幾個商品進去，就是下面的截圖，

從哪開始入手作呢？不少新入門的同窗可能就沒有思路了。若是用剛纔抽象蘋果的思路，就是這樣，

購物車

_增長、減小商品按鈕

_輸入商品數量

_刪除按鈕

_單選按鈕

_全選按鈕

_結算按鈕

_其它的相關調用、回調等

用JavaScript來表示就是這樣，

var _cartObj = {

addFn : addfn,

minsFn : minsfn,

singleBtn : singlefn,

allselect : allselectfn,

payBtn : paybtn

}

而後再繼續定義addfn、minsfn、singlefn、allselectfn、paybtn等函數，這就是從UI設計圖中抽象出功能點，而後在編程範式裏表達出來。這時，咱們已經擁有了一個購物車模塊的JavaScript模型。

這種抽象的編程思想的思惟方式，是超越於任何編程語言之上的，它是對現實世界的提煉和抽象。不管你是用原生JavaScript，仍是vue，或react，都是這樣，無非是寫法不一樣罷了。

我擁有這種思惟方式，因此我能夠用一天學會php，寫一個帶登陸、註冊的簡單留言板出來，而後再在第2、三天，完全忘記php。不是顯擺我有多麼牛，而是說這種思惟方式是超越具體語言的。

若是不能理解這個實物和抽象之間的對應關係，那麼不管你學習多少的css、html、js、jq、vue、h五、小程序...等，對你來說這些都是【死物】。由於你不知道該怎麼用它解決問題與需求。說的有點囉嗦，但真心的但願同窗們能明白它們的這個關係。

接下來再說說開發中的邏輯思惟。

邏輯思惟要嚴密且清晰，講究的是環環相扣。它不一樣於平常交流中的口頭描述，「你今天上午去那幫我拿個東西。去哪？就你家那邊一拐角」，這種基於生活經驗的直觀的描述就是混沌不清晰的。

一個經典的例子，口頭描述，「讓程序員，去買6個蘋果回來，路上若是看見西瓜就買一個」。問，若是這個程序員在路上看到一個西瓜，他會買幾個蘋果回來？

答案是，一個蘋果。爲何呢？

由於，

if( 看見西瓜 ){

蘋果 = 1

} else {

蘋果 = 6

}

看到了嗎？這就是使用平常生活思惟來寫代碼的結果。因此，編程開發中不能使用生活思惟方式，你必須環環相扣，造成一個邏輯鏈條。其中任何一環的不清晰，都會形成整個邏輯鏈條的崩潰。

編程由於須要抽象具體事物，因此它是以不一樣的視角來看待現實世界。你看到一匹白馬，說「好大好白的一匹馬」，我看到的是，

var 白馬 = {

腿：4,

顏色：#fff,

性別：公,

體重：200KG,

..

}

這算是另外一種形式的白馬非馬嗎？

在實際工做中，PM會提出產品需求，確定是口語化的描述。說這個產品，有abcd等功能。而後前端開發等程序員再把它抽象出特色，設計出模型。

而後根據它的交互流程、前置後置的條件等，一步一步的實現。這個一步一步的實現，就是開發邏輯的鏈條，差了其中任何一環，都不能完成開發任務。

就例如你回家吃飯，若是用程序的邏輯思惟方式來思考，是這樣的，

一、你回家；

二、家裏要有米，若是沒有，買米，若是買不到米，作不了飯；

三、家裏要有電，若是沒有，作不了飯；

四、家裏要有水，若是沒有，作不了飯；

這裏面要把全部的條件、狀況都考慮到。而不少狀況其實在你寫代碼的時候並無發生。因此有人說，編程是給將來的人使用的。將來的人會怎麼使用你開發出來的應用？你並不知道，因此你必須盡全力去無限窮盡全部可能。

編程思想是抽象特徵，邏輯思惟是環環相扣，這二個東西合在一塊兒，就是解決問題的方法和步驟。

而前端開發只不過是使用html、css、js，來實現編程思想和邏輯思惟所提供的解決問題的方法和步驟的一種工做而已。

因此，學習前端開發，實際上是學習如何用編程思想和邏輯思惟來解決問題，而不是學習html、css、js語言自己。

這也就是不少同窗，學完了，學會了html、css、js，卻依然不知道怎麼幹活的根本緣由。因此說回本文的標題，《零基礎前端入門，真正難在哪裏？》就難在如何創建本身的編程思惟和開發邏輯。

由於篇幅所限，這篇文章寫到這裏基本也就要結束了。若是這方面還有什麼其它的疑問，能夠加我vx：blazeloulan，或在文章末尾留言給我。我感腳，我仍是能夠給出一些建議的。