Javascript入門學習資源整理

整理了一些Javascript入門資源,給有心想踏入這個世界的人參考參考嘍。

書籍

  1. ppk on JavaScript:從實例學JavaScript
  2. JavaScript 編程精解 (Eloquent JavaScript: A Modern Introduction to Programming))
  3. JavaScript 大全 第六版(JavaScript The Definitive Guide, 6th Edition)

網路學習

  1. MDN
  2. Codecademy
  3. Javascript基礎介紹 投影片
  4. Javascript基礎介紹 範例題目

評估

  1. js-assessment 中文版

如何使用js-assessment

  1. 首先按照說明安裝並執行js-assessment之後,透過瀏覽器連至http://localhost:4444
  2. 一開始會發現一整頁都紅色的字,這時候開啓您喜愛的IDE,開始修改app/目錄下的程式碼。
  3. 修改好之後回到瀏覽器,按下重新整理
  4. 如果函式執行正確,該測試文字會變成綠色並打勾
  5. 如仍然不正確,會是紅色字,並顯示錯誤原因
  6. 如何debug? 此處假設瀏覽器是使用Chrome,按下⌘⌥I帶出開發者工具,點擊上方的Source如下圖。
  7. 點擊左上方Elements下面的箭頭,會有檔案列表,到localhost:4444下面的app資料夾,並找到剛剛修改的檔案(如下圖)
  8. 點選檔案之後,可以在檔案內插入breakpoint,只要在左方程式碼行數的地方點擊即可加入/移除斷點
  9. 重新整理頁面,程式即會於斷點處停止,右邊會列出目前程式的狀態
  10. 此時可以利用右上方四個按鈕可以控制程式的執行方式,或看目前變數的狀態,或是自己加條件式。
  11. 另一種方式是直接在程式碼裡面加上console.log(),丟給console.log的字串會在開發者工具的Console列印出來,如下圖。
  12. 這兩種方式應該可以幫助完成基本的js-assessment了

3 則留言: