《寫給所有人的運算思維入門》- 寫程式到底是在幹嘛？

初學 JavaScript 時，若沒有程式語言的基礎，我相信許多人和我一樣，遇上了強烈的不適應感。這是因為電腦思考方式和人類完全不同。《寫給所有人的運算思維入門》這本書循序漸進的為我們解釋在開始寫程式碼前，需要注意些什麼。

同步發表於：a { } after { }
( 個人技術部落格 )

基於我自己讀書的習慣，我一直覺得如果要理解一門學問，抓住這門學問的發展脈絡是很重要的。每件事都是一個龐大系統的一小部分，若是能從這個系統的基本邏輯下手，在這個大系統的每個部分轉換就會輕易很多，也不容易迷失在局部的景象中。

對我來說，JavaScript 也是這麼一回事。再切入技術層面、實際操作前，我想知道：這項技術是什麼、要做出些什麼、是根據什麼邏輯在執行。我想，透過理解這樣的「世界觀」，才能建立自己在這項技能上的自主性，而不是只能模仿他人。

如果要認真深究的話，肯定需要花上好幾年。不過，要稍微入門、抓住基本邏輯的話，我想應該不會是太困難的事情。《寫給所有人的運算思維入門》是我在思考這個問題時，碰巧在書局看到的，作者就是針對這個問題而寫的，這系列的文章就是我在讀這本書時記錄下來的東西，再加點自己的想法寫成的，希望能給正在入門程式語言但是又抓不到訣竅的人一點協助！

電腦很厲害、但電腦真的不懂你

雖然，電腦被視為本世紀最重要的發明，已經成了人類生活的一部分；現在的電腦甚至可以模仿人類學習的模式，有了「自主學習」這樣的類似人類的思考能力。看似全能的電腦，其實根本上並無法用人類思考的方式思考。

對於還沒接觸程式語言、不習慣電腦內部執行方式的人來說，程式設計/電腦思維這樣的概念可能會看起來非常嚇人、可怕、像咒語一樣無法理解。即便是有一點程式語言基礎的人，或許也還是會覺得電腦運作的方式非常地令人不習慣，讓人無法投入。這是因爲電腦無法像人類一樣靈活思考，隨時因應情境改變行動方針（即便現在的手機讓你覺得他應該可以！）。

例如，對於人類而言，「往前走」是件非常簡單、直覺的動作，甚至會讓你覺得「這有什麼好解釋的嗎？就是往前走啊！」可是，對電腦而言，「往前走」這樣的指令卻是模糊至極、難以理解。如果是 JavaScript 的話，這時候就是瀏覽器用紅色的警示瘋狂跳錯的恐怖時刻。它不是在造反，它只是很想跟你說：「我聽不懂、我聽不懂、我聽不懂。」

電腦需要的是把「往前走」拆成更精細的步驟：移動右腳、往某個方向跨出 50 公分、轉移重心、移動左腳、往前方邁進 50 公分；諸如此類的步驟。

這是我們在初入電腦世界時，需要理解的事情。它真的聽不懂人類的思考方式啊啊啊！

演算法、程式設計，蛤？

演算法這個字，根本企圖讓人誤會自己是不是要開始算數學了。先不要慌，它的定義看起來（？）是和數學沒什麼關係。上一個部分提到，電腦無法理解人類的思維，我們必須根據要達到的目標，例如一個網站要有什麼樣的流程，把人類想的功能拆解成電腦可以理解的詳細步驟。這個詳細的步驟就是演算法。

例如，我們如果要建構一個常見的 Navbar 功能：漢堡選單。以人類的思維我們會直覺性地覺得，在視窗變小時，連結列變成漢堡按鈕。

但什麼叫做視窗變小呢？什麼是連結列呢？這對電腦來說都是無法理解的敘述。所以，我們需要更細緻地觀察，當我們在說漢堡選單時，頁面上究竟發生了些什麼事情。可能是：

1. 視窗大小是 767 px 以下
2. Navbar 上的連結列消失
3. 漢堡按鈕顯現
4. 當漢堡按鈕被點擊時，以獨立區塊的方式（而不是像大螢幕時，用橫向列在 Navbar 上）顯示出連結列

然後，我們再把這一系列的步驟轉譯成程式語言、寫程式碼。這個轉譯的動作就是程式設計。

總結

複習一下上述的內容，當我們在寫程式時，實際上會經過什麼樣的流程：

規劃整體功能
將個別功能拆解成電腦可以理解的步驟
用手上可用的程式語言翻譯這些流程

補充：程式為什麼會出錯

撇除技術層面，一個寫出來的程式會出錯，是因為電腦是張完全的白紙，它在理解事情時，並沒有我們腦中相對應的知識、也沒有我們認為的任何「理所當然」。

拿上面的漢堡選單來說，一開始我在建構這樣的功能時，感到很挫折。我沒有想到要跟電腦解釋到這麼詳細，它才能執行我想要的簡單功能。為什麼我會覺得這件事很挫折呢？那是因為我覺得漢堡選單這件事完全就是「理所當然」的。我覺得不需要做任何調整，連結列應該就會按照我想要的方式在小螢幕顯示出來呀。

當然這是有點誇飾，我的意思是說，在比較複雜的功能時，可能會因為覺得「這件事上理所當然的吧，為什麼要想到這麼細」而產生思考上的盲點。