JavaScript程序設計基礎與範例教程（簡體書）

第1章 JavaScript程序概述 /1

1.1 學習JavaScript程序設計 /1

1.2 JavaScript簡介 /2

1.3 開發JavaScript應用程序 /5

【課堂案例1-1】：第1個JavaScript程序 /7

第2章 程序的構成——函數 /10

2.1 函數的使用 /10

【課堂案例2-1】：在網頁上輸出消息 /10 第1章 JavaScript程序概述 /1

1.1 學習JavaScript程序設計 /1

1.2 JavaScript簡介 /2

1.3 開發JavaScript應用程序 /5

【課堂案例1-1】：第1個JavaScript程序 /7

第2章 程序的構成——函數 /10

2.1 函數的使用 /10

【課堂案例2-1】：在網頁上輸出消息 /10

【課堂案例2-2】：在網頁上顯示圖片 /11

【課堂案例2-3】：在網頁中播放視頻，顯示視頻信息 /12

2.2 函數的參數 /13

【課堂案例2-4】：使用參數傳遞姓氏和名字，在網頁上輸出姓名 /14

【課堂案例2-5】：定義函數area()，用于計算矩形面積 /15

【課堂案例2-6】：按照參數顯示圖片 /16

2.3 函數的返回值 /17

【課堂案例2-7】：計算任意3個數的平均值 /17

【課堂案例2-8】：測試return語句功能 /18

【課堂案例2-9】：制作簡易杏仁巧克力 /19

【課堂案例2-10】：計算實發工資 /21

2.4 函數的嵌套定義 /21

【課堂案例2-11】：計算兩個圓的面積之和 /22

*2.5 高級函數特性 /22

【課堂案例2-12】：調用匿名函數 /22

【課堂案例2-13】：使用匿名函數限制變量的作用域 /24

【課堂案例2-14】：使用閉包（closure）特性調整頁面的字號 /25

【課堂案例2-15】：數組作參數，計算購物總金額 /28

【課堂案例2-16】：使用參數對象Arguments來計算任意n個數的和 /29

【課堂案例2-17】：使用函數對象編寫函數測試頁面 /30

【課堂案例2-18】：使用函數遞歸，輸出遞增的數字序列 /32

2.6 本章練習 /33

第3章 JavaScript語言基礎 /37

3.1 基本數據類型 /37

【課堂案例3-1】：數據類型測試及轉換 /40

3.2 變量和常量 /41

【課堂案例3-2】：變量的定義和使用 /41

【課堂案例3-3】：變量的賦值 /42

【課堂案例3-4】：變量的作用域 /43

【課堂案例3-5】：使用常量PI，轉換角度與弧度 /45

3.3 運算符和表達式 /46

【課堂案例3-6】：算術運算符使用示例 /46

【課堂案例3-7】：賦值運算符使用示例 /48

【課堂案例3-8】：使用關系運算符、條件運算符判斷用戶輸入的年齡 /50

【課堂案例3-9】：邏輯運算符使用示例 /51

【課堂案例3-10】：字符串運算符示例 /52

【課堂案例3-11】：位運算符示例 /53

【課堂案例3-12】：使用typeof運算符檢測數據類型 /55

3.4 本章練習 /55

第4章 JavaScript語句 /59

4.1 JavaScript語句和基本程序結構 /59

4.2 選擇語句 /60

【課堂案例4-1】：使用單分支if語句判斷兩個數字中的較大數 /60

【課堂案例4-2】：使用if語句將兩個數字按從小到大的順序輸出 /61

【課堂案例4-3】：使用if語句檢查參數值的有效性 /62

【課堂案例4-4】：使用if…else語句計算數字的絕對值 /62

【課堂案例4-5】：使用if…else語句判斷成績是否及格 /63

【課堂案例4-6】：使用if嵌套刪除文件（偽代碼） /65

【課堂案例4-7】：使用switch語句查詢簡單的日程表 /66

4.3 循環語句 /68

【課堂案例4-8】：使用while語句輸出遞增的數字序列 /68

【課堂案例4-9】：使用while語句在網頁上顯示一組圖片 /69

【課堂案例4-10】：使用do…while語句計算100到500之間所有整數的和 /70

【課堂案例4-11】：使用do…while語句計算m到n之間所有偶數的和 /71

【課堂案例4-12】：使用for語句輸出1到n之間所有的整數 /72

4.4 循環控制語句 /73

【課堂案例4-13】：使用break語句計算最小公倍數 /73

【課堂案例4-14】：continue語句演示 /74

4.5 循環嵌套 /74

【課堂案例4-15】：使用二重循環嵌套在頁面上顯示五子棋棋盤 /75

4.6 異常處理 /76

【課堂案例4-16】：使用throw語句拋出異常 /76

【課堂案例4-17】：使用try…catch()…finally處理異常 /77

4.7 本章練習 /79

第5章 基于原型的面向對象編程 /86

5.1 對象編程概述 /86

5.2 自定義對象的創建和使用 /87

【課堂案例5-1】：使用Object創建自定義對象book，用于描述圖書信息 /87

【課堂案例5-2】：使用Object創建自定義對象calc，用于簡單數學計算 /88

【課堂案例5-3】：使用構造函數創建自定義對象phone，用于描述電話信息 /89

【課堂案例5-4】：創建圖片對象，使用this訪問對象自身的屬性和方法 /90

【課堂案例5-5】：使用with簡化對象操作 /91

【課堂案例5-6】：使用instanceof運算符判斷對象類型 /93

【課堂案例5-7】：使用instanceof運算符檢查參數的類型 /94

【課堂案例5-8】：使用for…in 循環遍歷對象成員 /95

【課堂案例5-9】：使用私有對象屬性實現數據隱藏 /96

【課堂案例5-10】：為屬性添加賦值方法（Setter）和取值方法（Getter） /97

【課堂案例5-11】：使用原型（prototype）擴展對象類型 /99

5.3 對象繼承 /100

【課堂案例5-12】：使用call()方法實現對象繼承 /100

【課堂案例5-13】：使用原型鏈（Prototype Chain）實現對象繼承 /101

5.4 定義對象的不同方式 /103

【課堂案例5-14】：使用工廠函數方式創建對象 /103

【課堂案例5-15】：使用混合的構造函數/原型方式創建對象 /104

【課堂案例5-16】：使用動態原型方式創建對象 /106

5.5 本章練習 /107

第6章 本地對象 /109

6.1 本地對象概述 /109

6.2 Boolean對象 /109

【課堂案例6-1】：比較布爾值與布爾對象的區別 /110

【課堂案例6-2】：復制布爾對象 /111

6.3 Number對象 /112

【課堂案例6-3】：使用Number對象獲取數值極限 /113

【課堂案例6-4】：將數字轉換成字符串 /113

【課堂案例6-5】：設置數值精確度 /114

【課堂案例6-6】：數值進制轉換 /115

6.4 String對象 /116

【課堂案例6-7】：合成新的字符串 /118

【課堂案例6-8】：顯示字符串的Unicode編碼 /119

【課堂案例6-9】：截取字符串內容 /119

【課堂案例6-10】：在字符串中精確查找指定內容 /121

【課堂案例6-11】：在字符串中進行模糊查找 /122

【課堂案例6-12】：精確查找替換字符串內容 /123

【課堂案例6-13】：將字符串分割成數組，提取英文句子中前3個單詞 /124

【課堂案例6-14】：轉換字母大小寫 /125

【課堂案例6-15】：為字符串添加樣式 /126

6.5 RegExp對象 /127

【課堂案例6-16】：使用正則表達式替換字符串中的文本 /128

【課堂案例6-17】：使用正則表達式驗證電子郵箱格式 /129

【課堂案例6-18】：使用正則表達式交換單詞的位置 /130

6.6 Array對象 /131

【課堂案例6-19】：使用Array對象創建數組 /132

【課堂案例6-20】：使用for…in循環遍歷數組，并找到最大值 /133

【課堂案例6-21】：對數組進行排序 /134

【課堂案例6-22】：使用Array提供的方法添加、刪除或替換數組元素 /135

【課堂案例6-23】：將數組轉換成字符串 /136

【課堂案例6-24】：使用現有數組元素生成新數組 /137

【課堂案例6-25】：使用回調函數處理數組元素 /139

【課堂案例6-26】：使用二維數組 /141

6.7 Math對象 /143

【課堂案例6-27】：使用Math對象完成數學計算1 /144

【課堂案例6-28】：使用Math對象完成數學計算2 /144

6.8 Date對象 /146

【課堂案例6-29】：創建Date對象 /148

【課堂案例6-30】：使用Date對象計算程序運行時間 /150

【課堂案例6-31】：使用Date對象的方法設置/獲取日期時間信息 /151

6.9 Error對象 /152

【課堂案例6-32】：使用自定義Error對象拋出異常 /153

【課堂案例6-33】：處理系統拋出的異常 /154

6.10 全局對象 /155

【課堂案例6-34】：使用全局方法 /156

6.11 本章練習 /157

第7章 瀏覽器對象模型（BOM） /167

7.1 瀏覽器對象模型概述 /167

7.2 window對象 /168

【課堂案例7-1】：獲取瀏覽器窗口的位置和大小 /169

【課堂案例7-2】：控制瀏覽器窗口的位置和大小 /170

【課堂案例7-3】：使用模式對話框 /173

【課堂案例7-4】：制作簡單的數字時鐘 /175

【課堂案例7-5】：在網頁中實現滾動屏幕功能 /176

7.3 navigator對象 /178

【課堂案例7-6】：獲取瀏覽器及操作系統的相關信息 /179

【課堂案例7-7】：獲取當前瀏覽器安裝的插件信息 /180

7.4 location對象 /181

【課堂案例7-8】：獲取瀏覽器URL的相關信息 /182

【課堂案例7-9】：使用location對象實現頁面跳轉和刷新 /182

【課堂案例7-10】：創建頁面導航 /184

7.5 history對象 /186

【課堂案例7-11】：訪問歷史記錄中的URL /186

7.6 screen對象 /187

【課堂案例7-12】：獲取用戶屏幕信息 /188

【課堂案例7-13】：根據用戶屏幕信息切換網頁顯示效果 /189

7.7 本章練習 /190

第8章 HTML文檔對象模型（DOM） /192

8.1 文檔對象模型概述 /192

8.2 DOM核心接口 /196

【課堂案例8-1】：獲取DOM樹中的節點信息 /200

【課堂案例8-2】：刪除DOM樹中的節點 /202

【課堂案例8-3】：在DOM樹中添加子節點 /203

【課堂案例8-4】：替換DOM樹中的節點 /205

【課堂案例8-5】：復制DOM樹中的節點 /206

【課堂案例8-6】：獲取節點的屬性 /207

【課堂案例8-7】：控制文本節點 /209

【課堂案例8-8】：提取網頁中的超鏈接地址 /211

8.3 DOM HTML /212

【課堂案例8-9】：獲取文檔信息 /215

【課堂案例8-10】：修改文檔中的鏈接 /216

【課堂案例8-11】：操作文檔中的表格 /217

【課堂案例8-12】：獲取文本框中用戶輸入的內容 /220

【課堂案例8-13】：獲取單選框用戶選擇的內容 /221

【課堂案例8-14】：獲取復選框用戶選擇的內容 /222

【課堂案例8-15】：控制下拉菜單 /223

【課堂案例8-16】：判斷用戶選取的文件類型 /225

【課堂案例8-17】：限制用戶使用表單元素 /226

【課堂案例8-18】：驗證表單數據 /227

【課堂案例8-19】：為所有段落加邊框 /228

【課堂案例8-20】：選項卡效果 /230

【課堂案例8-21】：Web相冊 /231

【課堂案例8-22】：修改網頁背景色 /234

【課堂案例8-23】：顯示/隱藏頁面元素 /235

【課堂案例8-24】：覆蓋顯示圖片 /236

【課堂案例8-25】：在網頁中繪圖1 /238

【課堂案例8-26】：在網頁中繪圖2 /239

8.4 本章練習 /240

第9章 事件（Event）處理 /245

9.1 事件處理概述 /245

9.2 基于HTML屬性的事件處理方法 /245

【課堂案例9-1】：文檔事件 /246

【課堂案例9-2】：鼠標事件 /248

【課堂案例9-3】：獲得/失去焦點事件 /249

【課堂案例9-4】：鍵盤事件 /250

【課堂案例9-5】：onchange事件 /250

【課堂案例9-6】：使用this作參數 /251

【課堂案例9-7】：為事件設置響應函數 /252

9.3 DOM EVENT事件處理 /253

【課堂案例9-8】：注冊事件監聽器，設置背景圖片 /256

【課堂案例9-9】：注冊多個事件監聽器，實現簡易加法計算器 /257

【課堂案例9-10】：事件指派 /258

【課堂案例9-11】：顯示鼠標位置 /259

【課堂案例9-12】：創建快捷菜單，縮放圖片 /261

【課堂案例9-13】：創建快捷菜單，縮放圖片 /262

9.4 本章練習 /265

第10章 常用的數據交換格式和數據存儲技術 /267

10.1 XML文檔 /267

【課堂案例10-1】：同步訪問XML文檔，獲取圖書信息 /269

【課堂案例10-2】：異步訪問XML文檔，設置段落樣式 /270

【課堂案例10-3】：XML生成樹狀菜單 /272

10.2 JSON /274

【課堂案例10-4】：使用JSON對象 /274

【課堂案例10-5】：訪問JSON對象中的對象 /276

【課堂案例10-6】：使用JSON數組 /276

【課堂案例10-7】：訪問JSON對象數組 /277

10.3 數據存儲 /278

【課堂案例10-8】：使用cookie存儲用戶賬戶信息 /278

【課堂案例10-9】：使用localStorage存儲數據 /280

【課堂案例10-10】：使用sessionStorage存儲數據 /282

10.3 本章練習 /284

第11章 綜合練習——服飾設計網站 /286

11.1 網站整體說明 /286

11.2 JavaScript程序說明 /287

顯示全部信息

技術背景
JavaScript是一種廣泛用于客戶端網頁開發的腳本語言，早期主要用來給HTML網頁添加動態功能。隨著Web開發技術領域的迅速發展，JavaScript以其跨平臺、容易上手等優勢大行其道。有些特殊功能（如AJAX）必須依賴JavaScript在客戶端進行支持。隨著Google-V8引擎和Node.js框架的發展，JavaScript逐漸被用來編寫服務器端程序。HTML5和移動設備的廣泛應用，也會使JavaScript的前景更加絢麗。
就業需要
JavaScript腳本語言是開發Web應用程序所必備的技術。隨著HTML5的廣泛應用，就業崗位對于JavaScript的需求會越來越強烈。JavaScript驟然變成了聚光燈下的明星語言，越來越多的開發者加入到JavaScript陣營。下圖是Indeed.com對Web開發技術崗位需求的統計。

由趨勢分析圖可以看出，JavaScript的就業崗位需求量遠遠超過其他語言。
本書編寫目的
很多高職高專院校已將JavaScript作為一門重要的程序設計課程。本書在編寫過程中力求突出高職教育的特點，以“應用”為主旨和特征，以“實踐教學”為主要目的，以“培養學生的專業技術應用能力和職業操作技能”為教材編寫重點，注重對學生編程思想的啟發和培養，提高他們的分析問題、解決問題的能力，將教學內容與職業培養目標相結合。通過本書的學習，讀者可以掌握如下技能：
JavaScript語法基礎；
處理JavaScript內置對象，如String、Array、Number、Math、RegExp等；
使用BOM、DOM控制文檔元素；
處理網頁事件；
使用不同的方式持久化數據；
訪問常見元數據，如XML、JSON。
本書主要內容
本書所討論的內容包括JavaScript基本知識和實用技術，以及不斷發展、與時俱進的新技術、新應用。內容講解由淺入深、循序漸進，將理論知識與實踐相結合，案例選取實用性強、針對性強。
第1章介紹了JavaScript腳本語言的作用和特點，如何學習JavaScript語言，如何選擇適合自己的開發工具，如何添加注釋，如何選擇瀏覽器，如何將JavaScript嵌入到HTML頁面并運行調試，以及如何養成良好的代碼書寫規范。
第2章介紹了JavaScript函數的基本用法，包括函數的定義及調用、參數的用法、返回值的用法、函數編寫規則。函數是JavaScript的靈魂，將函數放在本書第2章講述，以便讓后面章節的課堂案例及練習使用函數實現，使讀者切實掌握函數的用法。
第3章介紹了JavaScript編程的基本元素，包括基本數據類型、常量、變量、運算符、表達式以及類型轉換。
第4章介紹了JavaScript流程控制語句的使用，掌握選擇語句、循環語句、循環控制語句是任何程序設計語言的基本功。
第5章介紹了如何使用JavaScript自定義對象，如何私有化數據成員，使用this關鍵字訪問自身數據，使用with關鍵字簡化對象訪問，使用for...in循環訪問對象屬性，以及ECMAScript5的對象保護功能等。
第6章介紹了JavaScript本地對象，包括String、Number、Boolean、Array、Date、RegExp、Error、Global、Math對象的用法。JavaScript內置了很多對象，這使得開發工作輕松了許多。
第7章介紹了瀏覽器對象模型（BOM），包括window、history、screen、location、navigator對象的用法。通過本章的學習，讀者可以掌握創建新的瀏覽器窗口、獲取客戶機屏幕信息、獲取瀏覽器相關信息。
第8章介紹了文檔對象模型（DOM），包括DOM核心接口的定義、DOM HTML接口的定義、常見頁面元素的操作、表單元素的操作、DOM節點操作方法。通過本章的學習，讀者可以通過DOM對象控制頁面上的任何內容，包括修改元素屬性、驗證表單、使用畫布元素等。
第9章介紹了JavaScript事件處理，包括事件觸發、事件對象。通過本章的學習，讀者可以處理常見事件，了解DOM Event接口，訪問事件對象。
第10章介紹了幾種元數據存儲格式以及數據持久化技術，包括XML格式、JSON格式，cookie、localStorage、sessionStorage對象。通過本章的學習，讀者可以使用JavaScript訪問XML文檔、訪問JSON數據，使用cookie、localStorage和sessionStorage對象存儲數據。
第11章綜合運用Web開發技術來制作一個完整的服飾設計網站，使用JavaScript為網站添加動態、交互效果，驗證表單數據，通過實踐提高讀者編程技法。
本書特色
1．符合初學者學習特點
本書實例豐富、技術實用、結構安排合理，知識講解循序漸進，對實例的分析清晰到位，讓讀者快速步入JavaScript開發殿堂。
2．適合學校組織教學的需要
根據教學需要，設計有針對性的練習題，注重啟發讀者編程思維。課堂案例和練習準確地覆蓋學習目標和知識要點，方便教師設計教學過程，方便學生了解學習目的。
3．內容新穎，具有技術前瞻性
本書內容新穎多樣、概念清晰、實用性強，涵蓋當前主流JavaScript應用開發技術。許多其他同類教材所介紹的技術內容比較基礎，技術更新比市場需求慢半拍。而本書更注重技術的實用性以及前瞻性，介紹了許多當前主流，或即將流行的新技術。
使用方法及課時分配
本書中有大量精彩的范例、練習題，這些素材來自作者多年來的軟件開發、教育教學經驗。本書內容在實際教學過程中運用多年，效果良好。計劃學時為108學時，建議將課時分為講解與實訓兩部分。
著作者分工
本書由曹維明擔任主編，編寫本書第6章至第11章內容。劉燕、吳劍文、趙卉擔任副主編，編寫本書第1章至第4章的內容，白建華參與編寫了第5章的內容。
在本書編寫過程中，我們本著科學、嚴謹的態度，力求精益求精，但錯誤、疏漏之處在所難免，請廣大讀者批評指正。

編 者