- 它在當今的電腦網路環境中，幾乎無所不在，不論是網頁、電腦、手機應用程式，都可見到它的蹤跡，很難不會去接觸到它。即使在十多年前，它的主要使用環境是在瀏覽器的網頁中，對於我這種重度網路使用者，難免要與它打交道。
- 既然難免要用到它，總要想辦法學。而我自學JavaScript的途徑顯然不是教育的好榜樣，這又與台灣的資訊教育偏向有關，後面再補述這點。早期，就說約千禧年後的幾年好了，雖然我接觸JS的時間更早，台灣市面上的JavaScript中文書籍大多以網頁特效的角度來介紹JavaScript，而且許多會偏向使用某個特定瀏覽器。如果看倌清楚當時瀏覽器大戰的激烈程度，就可以預料到我接下來要說什麼，就是如果照書上教的學完了後，在實際使用時就會發現到，在許多情況下，書上有很多東西不是不能用，就是執行結果與預期的不一樣。所以自然就不易學好基礎，反而形成許多混淆。
- 即使可以學到良好基礎，受第2點所述的瀏覽器之爭的影響，寫出的代碼要克服瀏覽器之間的差異性也是大費周章。當然這點在目前已不像以往般複雜，尤其IE宣告出局後，事情就簡單多了。
- 舊版JavaScript的語法，就個人觀點，實在是不怎麼討喜，尤其是對於已慣用了其它相對簡潔語言的人而言。不過這點在ECMAScript 2015（或稱ECMAScript 6，簡稱ES 6）出現後，已讓我大為改觀。
了解這語言有什麼好處？如果這與你的工作無關，這問題就不重要，否則，這裡提供幾個親身經歷以及幾個事實供參考。
- 過去工作上曾有位網頁設計人員向我請教為何她最近新製作的網頁在瀏覽器中總是要隔好一段時間才會出現？我稍看了一下她製作網頁的工作環境中的成品檔案，很快就發現一個體積大於1 MB的.js檔案。網頁顯示很慢的原因是工作上與她配合的那位自以為是的菜鳥程式員，為了網頁選單特效，從網路上弄來的這個程式碼檔案。我提醒她這個.js檔案已遠比她在網頁專案中所製作的圖片還大上許多，而且還很可能把程式碼掛在網頁的前頭，所以瀏覽器在載入與執行這檔案花不少時間，導致網頁的其它內容很慢才出現。這也是我為何在前面提到早期我是偏向少用JavaScript的原因之一，其實許多網頁的效果也可以用CSS達成，不一定要用JavaScript與大量裝飾圖片才可以做出美美的網頁。
- 在無名小站盛行但還沒被Yahoo!奇摩合併的年代，曾有位程式員問我如何做出像無名小站限制不讓讀者用滑鼠選取與複製網頁文字的功能。我當時只是簡單回答我自己不做這種事，沒多做解釋，對方的工作並不是寫網頁程式，我想避免太多解釋以免讓人覺得囉嗦。其實這種限制對於稍懂JavaScript的人是沒什麼作用的，因為只要禁用瀏覽器的JavaScript就失去作用了，當然這類限制也不盡然都是以JS做的。我甚至看過有人不動用什麼特殊工具或設定，只消按幾下瀏覽器的快捷鍵就把網頁上限制使用者選取與複製的文字全弄到手了，究竟是哪幾個快捷鍵呢？請看一下“編輯”下的那組命令選單就知道答案了。有時他人會問我資料做些存取限制後放網路上是否安全可靠，我的建議通常是，如果資料具機密性或不想讓不相干的人取得，別放網路上，別用電子郵件傳輸，甚至別放在有開放網路連線的機器上。像上述的網頁限制，其實資料都已傳到讀者的瀏覽器中並以明文顯示了，有心人只要腦筋轉個彎，豈有拿不到的道理？
- 幾年前曾經出現台灣某科技大廠徵求JavaScript開發人員，卻一時徵不到人的冏境，這就與前面提到的資訊教育的問題有關。過去台灣的資訊教育往往偏重使用某家資訊大廠的軟體，而且所教的往往與實際的需求與流行有些差距，像以往學校或書上教的利用XML傳遞資料，但那時我已看到流行的會是JSON。這種教育偏向的結果也導致許多政府機構的網站外包設計後，只能用那家大廠的瀏覽器才能正常顯示，但手機、平板大為流行後，這種系統就廣受民眾批評，因為絕大多數手機並不是用那家大廠的瀏覽器。
- 也是3.的延續。甚至，網頁開發人員對於網頁的運作細節了解不多，只要會用大廠的開發軟體就能做出網頁系統，但一旦出現問題，卻不知從何處下手解決。我就真的看過一家與金融投資相關的公司，使用這家大廠的開發工具與資料庫所開發出來的網頁版會員系統，在登出後，只要按瀏覽器的“回到上一頁”，竟然還能看到原本必須要登入系統才能看得到的東西，而且還數次碰到過這系統的網頁出現過資料連結錯誤的訊息。從事網頁程式開發工作，最好把網頁的運作方式搞清楚，以免開發出像前述安全漏洞百出的網頁系統，還有HTML也要有些了解，可以的話JavaScript與CSS多少懂一些絕不吃虧，另外就是安全議題要多少了解一下，尤其往後網路攻擊會越來越常見，最起碼要避免所開發的系統提供給人家攻擊的機會。
- JavaScript老早已非吳下阿蒙，不是只限用於網頁環境，除了網頁，手機、平板、行動裝置、電腦桌面的應用都能用JavaScript開發，而且在多數流行的作業平台都可使用。
JavaScript資源列表
學習與參考文件類
- MDN上的JavaScript教學、指導、參考、工具與資源：這是我常去造訪（查參考）的聖地。
- Document Object Model (DOM)：同樣是MDN上的文件，也是常造訪之處。我用JS大多在處理DOM。
- AJAX：MDN的AJAX文件。因為現在多數函式庫已把AJAX的使用包裝的很好了，所以這個當參考即可。
- DevDocs：DevDocs整合了許多開發文件，並提供一致性的文件呈現、搜尋方式，其中也包含Javascrip, DOM，這部分文件也是源自MDN。
- Fooish 網頁技術教學：包含了JavaScript, jQuery的教學。
- 《ECMAScript 6 入門》：是一本開源的JavaScript語言教程，全面介紹 ECMAScript 6新引入的語法特性。簡體中文書。
- 阮一峰的网络日志，JavaScript類文章：前述 《ECMAScript 6入門》作者寫的文章。
- ECMAScript 6：New Features: Overview & Comparison
- Practical Modern JavaScript, Dive into ES6 and the future of JavaScript：線上版。
- es6-cheatsheet：A cheatsheet containing ES2015 [ES6] tips, tricks, best practices and code snippet examples for your day to day workflow.
- JavaScript Tutorial：內容稍舊，但後面的DOM解說可以看。
- HTML 5 JavaScript API Index
JavaScript函式庫
- jQuery：歷史悠久，可算是第一代出現的函式庫。
- D3.js：簡單說，繪製圖表的函式庫。如果覺得太複雜，可以先試試其他以D3.js為基礎的函式庫，像〈C3.js 簡易快速入門〉中所提到的，像這類的其實還不少。
Node.js
- Node.js：JavaScript執行環境。
- npm：Node.js套件管理程式。
- request：Request is designed to be the simplest way possible to make http calls.
- cheerio：Fast, flexible & lean implementation of core jQuery designed specifically for the server.
工具類
- PhantomJS：一種headless browser，我偶而拿它做webscraping，但它的用途並不只這項。
他人整理的Awesome list
- Awesome JavaScript Learning：An awesome list limited to the best JavaScript learning resources.
- Awesome-Javascript：A collection of awesome browser-side JavaScript libraries, resources and shiny things.
- Awesome Node.js：A curated list of delightful Node.js packages and resources.
- awesome npm：Awesome npm resources and tips.
- Awesome Node.js projects：A curated list of awesome open-source applications made with Node.js. See Awesome Node.js for a curated list of packages and resources.
沒有留言:
張貼留言