五南官網

給中小學生的JavaScript：在樂趣中學程式設計
JavaScript for Kids:A Playful Introduction to Programming

分享Facebook

作　　者╱

Nick Morgan

譯　　者╱

李強

出版社別╱

小五南

書　　系╱

學習高手

出版日期╱

2019/02/01 (1版 1刷)

I S B N ╱

978-957-763-238-8

書　　號╱

YI16

頁　　數╱

328

開　　數╱

20K

定　　價╱

380 (特價 300)

把真正的程式設計變得簡單

JavaScript是主流的Web程式開發語言，是建立令人驚訝的互動式網頁應用程式和線上遊戲的祕密武器。本書用輕鬆愉快的方式，透過耐心的、按部就班的範例，以及充滿趣味的圖示，幫助讀者輕鬆地學習程式設計的基礎知識。

本書帶領讀者從基礎知識開始，例如處理字串、陣列以及迴圈，然後繼續學習一些進階主題，例如使用jQuery建構互動性，以及使用畫布繪圖。

透過閱讀本書，你將實際撰寫出諸如Find the Buried Treasure、Hangman和Snake這樣的遊戲。透過彈跳球、蜜蜂動畫、賽車這樣的視覺化範例，你將真正地看到自己所編寫的程式。每一章都建構於前一章的基礎之上，每一章末尾的「程式設計挑戰」將擴展你的思路，並激發出屬於你自己的、令人驚訝的程式。今天，就用JavaScript 設計一些很酷的東西吧！

※審定者簡介
林裕勝
林裕勝
臺北市日新國小校長
臺北市國小資訊教育輔導團團長
臺北市日新自造教育及科技中心計畫主持人
臺北市自由軟體推動小組召集人
16年以上資訊教育推動相關經驗
非資訊科系，靠自學自修網路及資訊科技

Nick Morgan 是 Twitter的一名前端工程師。他熱愛程式設計，並且特別關注JavaScript。Nick和她的未婚妻，以及他們的絨毛犬Pancake，居住在舊金山。他的部落格網址是 skildrick.co.uk。

※譯者簡介
李強
李強
專業程式設計翻譯

第1部分基礎知識
第 1章什麼是JavaScript?
第 2章資料類別和變數
第 3章陣列
第 4章物件
第 5章 HTML的基礎知識
第 6章條件與迴圈
第 7章建立Hangman遊戲
第 8章函式

第2部分進階JavaScript
第 9章 DOM與 jQuery
第10章互動性程式設計
第11章尋找埋藏的寶藏
第12章物件導向程式設計

第3部分 Canvas
第13章 Canvas元素
第14章在畫布上讓物體移動
第15章用鍵盤控制動畫
第16章開發貪吃蛇遊戲:第1部分
第17章開發貪吃蛇遊戲:第2部分

術語表
後記-繼續學習之路


富小孩養成系列：我的零用錢( 精) (限中國大陸以外地區銷售)	數學這樣學：國小數學感學習五年級	給中小學生的P ython：初學程式設計也能快速上手

苦瓜臉不見了：我不想上學，因為我害怕！(精 )	專門用來打好四則運算基礎的數學課本《第５級》	專門用來打好四則運算基礎的數學課本《第４級》

第1部分基礎知識
第1章什麼是 JavaScript？
電腦是功能強大到令人難以置信的機器，它能夠執行很多驚人的功能，例如：下西洋棋、提供數以千計的 Web網頁瀏覽服務，或者在數秒鐘之內執行數百萬次複雜的計
算。但是深入去看，你會發現電腦實際上是很笨的，電腦只能夠執行人類要它做的事情。我們使用電腦程式告訴電腦採取什麼動作，而程式就是命令電腦遵從的指令的集合。
沒有程式的話，電腦什麼也做不了！
1.1　認識 JavaScript
更糟的是，電腦不能理解英語或任何人類的語言。電腦程式是使用像JavaScript 這樣的程式語言來編寫的。你之前可能沒有聽說過JavaScript，但是，你一定已經用過它了。JavaScript 語言用來編寫在 Web 網頁中執行的程式。 JavaScript可以控制一個Web 網頁的外觀，並且當瀏覽者點擊按鈕或移動滑鼠時，它讓網頁做出回應。
諸如Gmail、Facebook 和Twitter 等網站都使用JavaScript，使得發送郵件、發布評論或瀏覽網站更加容易。例如：當你在Twitter上閱讀@nostarch 發布的tweets 的時候，隨著網頁滾動，你會在網頁的底部看到更多的tweets，這就是JavaScript做的。
要搞清楚JavaScript 為何如此令人興奮，你只需要造訪幾個Web 網站。
•JavaScript 可以播放音樂並創造驚人的視覺效果。例如：你可以欣賞由 HelloEnjoy為Ellie Goulding所做的歌曲“Lights”所建立的一個互動式音樂影片（http://lights.helloenjoy.com/），如圖1-1所示。

•JavaScript 使你能為其他人建構工具，以便用來創作音樂藝術。Patatap（http://www.patatap.com/）是一個虛擬的「鼓聲音源器」，可以創作各種很酷的聲音以及伴隨聲音的很酷的動畫，如圖 1-2 所示。

•JavaScript 讓你玩有趣的遊戲。 CubeSlam（https://www.cubeslam.com/）是經典遊戲Pong 的一個3D復刻版本，它看上去就像是桌上冰球。你可以和朋友對打，也可以和電腦所產生的一隻熊來對打，如圖1-3 所示。

1.2　為何要學習JavaScript
JavaScript 並非唯一的程式語言，實際上，這世上還有數以百計的程式語言。學習JavaScript 的理由有很多。首先，它比很多其他的語言更容易學習（而且更有樂趣）。但可能還有一個最好的理由，就是要編寫和執行JavaScript 程式，你只需要像Internet
Explorer、Mozilla Firefox 或Google Chrome 這樣的一個 Web 瀏覽器就夠了。每個Web 瀏覽器都內含JavaScript 直譯器，它可以理解如何閱讀JavaScript 程式。
一旦你編寫了JavaScript 程式，就可以將該程式的連結發送給別人，並且，他們可以在自己的電腦上的Web 瀏覽器中執行程式（參見本書後記中的「使用JSFiddle分享你的程式碼」部分）。

1.3　編寫JavaScript
讓我們在Google Chrome（Google 網頁瀏覽器，以下簡稱Chrome，可在http://www.google.com/chrome/ 免費下載）中編寫一什麼是些簡單的JavaScript。在你的電腦上安裝Chrome（如果還沒有安裝的話），然後，打開Chrome 並且在位址欄輸入about:blank。現在，按下Enter 鍵，你將會看到一個空白網頁，如圖1-4 所示。
我們透過在Chrome 的JavaScript 控制台編寫程式開始，這是程式設計師測試JavaScript 程式的一種祕密方式。在MicrosoftWindows 或Linux 上，按下Ctrl 鍵和Shift 鍵，並且按下J鍵。
在Mac OS 上，按下Command 鍵和Option 鍵，並且按下J 鍵。如果你正確地完成了所有的事情，應該會看到一個空白頁，但是在其下面有一個大於符號（>），後面跟著一個閃爍的游標（|），如圖1-4 所示。這是將要編寫 JavaScript 的位置。

NOTE:Chrome 控制台將會以彩色顯示你的程式碼文字，例如：你輸入的文字是藍色的，輸出將會根據其類型而顯示不同顏色。在本書中，我們對程式碼文字採用和控制台所使用的類似的顏色。

1.4　JavaScript 程式的結構
讓我們建立一個看上去有點笨的JavaScript 程式，它輸出如下所示的一系列貓臉：
和加法程式不同，這個JavaScript程式需要幾行程式碼。要將該程式輸入到控制台，你必須在每一行程式碼的末尾同時按Shift 鍵和Enter 鍵，以便增加新的程式碼行。（如果只是按Enter 鍵的話， Chrome將會試圖執行你所編寫的內容，並且程式不會像期望的那樣工作。我警告過你，電腦是很笨的。）