JavaScript入門教程-全套課件

上傳人：1*** IP屬地：福建上傳時間：2025-03-08 格式：PPT 頁數：351 大小：6.41MB 積分：35 舉報 版權申訴

已閱讀5頁，還剩346頁未讀，繼續免費閱讀

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

JavaScript入門教程第1章認識JavaScript課程安排腳本語言JavaScript第一個JavaScript程序JavaScript代碼編寫注意事項腳本語言JavaScript腳本語言的分類如今成熟的腳本語言非常多，根據使用方式的不同分成嵌入式和非嵌入式兩類。嵌入式腳本語言，這類語言通常為了應用程序的擴展而開發出來。解釋器通常嵌入在被擴展的應用程序中，成為宿主程序的一部分。例如，Lua語言、Python語言的嵌入性也比較好，如今這兩者在游戲開發領域應用較多，通常作為游戲軟件的腳本系統或配置文件。根據筆者的經驗，Lua語言無論在嵌入性和運行效率上都遠超過其他語言，將Python語言納入嵌入式語言分類中有些勉強，因為其更像其他獨立運行的語言。非嵌入式腳本語言，這類語言無須嵌入其他程序中，如本書所講的JavaScript語言。這些語言主要應用不是作為系統擴展，而是實現一般的任務控制。腳本語言JavaScriptJavaScript的標準與歷史眾多Web瀏覽器對JavaScript的支持也很不一致，相同的語言特性在不同的瀏覽器中會有所差異。這種差異對開發者影響極大，開發時不得不為不同的瀏覽器編寫不同的代碼，這種難堪的局面一直持續到JavaScript標準的制定。1997年發布了ECMA-262語言規范，將JavaScript語言標準化并重命名為ECMAScript，現在各種瀏覽器都以該規范作為標準。提示：語言和系統接口標準化后可以大大減輕應用開發人員的負擔，不用為不同的語言特性或接口編寫不同的代碼，這也增強了軟件的可移植性。腳本語言JavaScriptJavaScript在網頁中的應用JavaScript的腳本包括在HTML中，它成為HTML文檔的一部分。與HTML標識相結合，構成了一個功能強大的Internet網上編程語言。使用特定的標記可以直接將JavaScript腳本加入文檔：01 <html> 02 <head></head> 03 <body> 04 <scriptLanguage="JavaScript">05 JavaScript語言代碼；JavaScript語言代碼;06 </script>07 </body> 08 </html> 腳本語言JavaScriptJavaScript的發展趨勢語言永遠被當做工具，這一點從來都沒有被改變過，以后也不會。例如，在Windows平臺上，使用ADODB組件可以使JavaScript能處理支持SQL的數據庫中的數據，使用FSO組件可以實現本地文件IO功能。這一切都說明了JavaScript位于應用開發的最頂端，其與低層技術的實現無關，層次結構如圖1-2所示。盡管平臺技術不斷發生變化，JavaScript仍將以不變的形式去使用平臺提供的能力從而適應新的需求。未來的一段時間內，Web開發將是開發者眾聚之地，也是JavaScript變得紫紅的時代。第一個JavaScript程序學習每一門新語言，大致了解了它的背景之后，最想做的莫過于先寫一個最簡單的程序并成功運行。如果最初連續幾個程序都無法成功編譯或運行，初學者學習的信心多少會受些打擊，這是正常現象。本節將帶領讀者對JavaScript進行第一次實踐嘗試，用它編寫一個最簡單且流行了幾十年的“HelloWorld”程序。第一個JavaScript程序選擇JavaScript編輯器JavaScript源程序是文本文件，因此可以使用任何文本編輯器來編寫程序源代碼，如Windows操作系統里的“記事本”程序。為了更快速地編寫程序并且降低出錯的概率，通常會選擇一些專業的代碼編輯工具。專業的代碼編輯器有代碼提示和自動完成功能，筆者推薦使用AptanaStudio，它是一款很不錯的JavaScript代碼編輯器。第一個JavaScript程序編寫HelloWorld程序01 <html> <!HTML文檔開始>02 <body> <!文檔體開始>03 <scriptlanguage="JavaScript"> <!腳本程序>04 document.write("HelloWorld!"); //輸出經典的HelloWorld05 </script> <!腳本結束>06 </body> <!文檔體結束>07 </html> <!HTML文檔結束>第一個JavaScript程序運行程序運行JavaScript程序最簡單的方法就是使用瀏覽器打開包含JavaScript代碼的網頁文件，通常網頁文件的擴展名為htm或者html。使用系統自帶的瀏覽器即可。JavaScript代碼編寫時的注意事項JavaScript程序的書寫有些許需要注意的地方，如大小寫敏感、單行和多行、分號的運用等。初學者在編寫程序時通常會觸犯這些規則，應該盡力避免。用戶自定義的標識符不能與語言保留的關鍵字同名，通過使用一些專業的編輯器可以幫助消除語法錯誤。JavaScript代碼編寫時的注意事項大小寫敏感空格與換行分號可有可無注釋形式JavaScript入門教程第2章JavaScript中的數據類型課程安排基本數據類型復合型數據數據類型的轉換基本數據類型字符串型數據在JavaScript中，字符串型數據是用引號引起的文本字符串。例如，“好久不見，你還好嗎？”或‘Bob是個聰明的孩子’。每一個字符串數據都是String對象的實例，其主要用于組織處理由多個字符構成的數據串。定義一個字符串時不需要指定類型，只需要按以下語法定義即可。基本數據類型字符串型數據01 <scriptlanguage="javascript"> //腳本程序開始02 07 </script> 基本數據類型數值型數據JavaScript中用于表示數字的類型稱為數值型，不像其他編程語言那樣區分整型、浮點型。數值型用雙精度浮點值來表示數字數據，可以表示（-253，+253）區間中的任何值。數字的值可以用普通的記法，也可以使用科學記數法。基本數據類型數值型數據本示例第4～6行定義三個變量，并分別賦十六進制表示的初值。第8～10行將三個變量輸出為十進制表示的數。第13～15行定義三個變量，分別賦八進制表示的初值。第17～19行將三個變量輸出為十進制表示的數。第21～26行定義數個變量，并對它們賦予用不同表示法表示的十進制數值。第27～31行將變量t1～t6逐一輸出為普通的十進制數字。基本數據類型布爾型數據布爾型是只有“真”和“假”兩個值的數據類型。作為邏輯表達式的結果，真值用“true”表示，假值用“false”表示。事實上，非0值即為“真”，0值即為“假”。布爾型數據通常用來表示某個條件是否成立。基本數據類型布爾型數據本示例使用了if語句對布爾型變量的值進行判斷，關于if語句，將在后面的章節講到。此處讀者只需知道如果if后圓括號里布爾型變量的值為真，則執行if后“{}”中的語句。復合型數據內置對象

表2-1JavaScript中常用的對象名稱作用Object所有對象的基礎對象Array數組對象，封裝了數組的操作和屬性ActiveXObject活動控件對象arguments參數對象，正在調用的函數的參數Boolean布爾對象，提供同布爾類型等價的功能Date日期對象，封裝日期相關的操作和屬性的對象Error 錯誤對象，保存錯誤信息Function函數對象，用于創建函數Global全局對象，所有的全局函數和全局常量歸該對象所有Math數學對象，提供基本的數學函數和常量Number數字對象，代表數值數據類型和提供數值常數的對象RegExp正則表達式對象，保存正則表達式信息的對象String字符串對象，提供串操作和屬性的對象復合型數據日期對象JavaScript將與日期相關的所有特性封裝進Date對象，包括日期信息及其操作，主要用來進行與時間相關的操作。Data對象的一個典型應用是獲取當前系統時間，使用前首先創建該對象的一個實例，語法如下：date=newDate(); //直接創建date=newDate(val); //指定日期創建date=newDate(y,m,d[,h[,min[,sec[,ms]]]]); //指定年月日分秒創建復合型數據日期對象01 <scriptlanguage="javascript"> //腳本程序開始02 15 </script> 復合型數據數學對象

數學對象（Math）封裝了與數學相關的特性，包括一些常數和數學函數，主要使用簡單一些基本的數學計算。該對象和Global對象一樣不能使用new運算符創建，Math對象在程序運行時由JavaScript環境創建并初始化。

復合型數據數學對象01 <scriptlanguage="javascript"> //腳本程序開始02 08 </script> 復合型數據全局對象

全局對象是所有全局方法的擁有者，用來統一管理全局方法，全局方法也就是指全局函數。該對象不能使用new運算符創建對象實例，所有的方法直接調用即可。以下是幾個常用的Global對象的方法，如表2-4所示。表2-4Global對象的常用方法方法名功能描述isNaN(value)判斷value是否是NaN，返回一個布爾值parseFloat(string)返回由字符串string轉換得到的浮點數parseInt(string)返回由字符串string轉換得到的整數復合型數據字符串對象

String對象封裝了與字符串有關的特性，主要用來處理字符串。通過String對象，可以對字符串進行剪切、合并、替換等操作。可以調用該對象的構造函數創建一個實例，其實在定義一個字符串類型變量時也就創建了一個String對象實例。調用String對象的方法或屬性形式如“對象名.方法名”或“對象名.屬性名”，其構造函數如下：String([strVal]);參數strVal是一個字符串，可選項。創建一個包含值為strVal的String對象。復合型數據數組對象

數組是JavaScript中另一種重要的基本數據類型。內部對象Array封裝了所有與數組相關的方法和屬性，其內部存在多個數據段組合存儲。可以形象地將其理解為一種有很多連續房間的樓層，每個房間都可以存放貨物，提取貨物時只需要給出樓層號和房間編號即可

。復合型數據數組對象<scriptlanguage="javascript">//腳本程序開始</script>數據類型的轉換隱式類型轉換

程序運行時，系統根據當前上下文的需要，自動將數據從一種類型轉換為另一種類型的過程稱為隱式類型轉換。此前的代碼中，大量使用了window對象的alert方法和document對象的write方法。可以向這兩個方法中傳入任何類型的數據，這些數據最終都被自動轉換為字符串型。數據類型的轉換隱式類型轉換<scriptlanguage="javascript">//腳本程序開始</script>數據類型的轉換顯式類型轉換

與隱式類型轉換相對應的是顯式類型轉換，此過程需要手動轉換到目標類型。要將某一類型的數據轉換為另一類型的數據需要用到特定的方法。比如前面用到的parseInt、parseFloat等方法

。數據類型的轉換顯式類型轉換

提示：當要轉換的字符串帶有parseInt或parseFloat方法不可識別的字符時，轉換結果可能沒法預料。讀者可自行做這方面的測試。JavaScript入門教程第3章常量、變量、運算符和表達式課程安排常量和變量什么是表達式什么是運算符運算符的優先級常量和變量什么是常量程序一次運行活動的始末，有的數據經常發生改變，有的數據從未被改變，也不應該被改變。常量是指從始至終其值不能被改變的數據，JavaScript中的常量類型主要包括字符串常量、數值常量、布爾常量、null和undefined等。常量通常用來表示一些值固定不變的量，比如圓周率、萬有引力常量等。常量直接在語句中使用，因為它的值不需要改變，所以不需要再次知道其存儲地點。

常量和變量什么是常量<scriptlanguage="javascript"> //腳本程序開始<!-- document.write("<li>JavaScript編程，樂趣無窮!<br>");//使用字符串常量

document.write("<li>"+5+"周學通JavaScript!"); //使用數值常量3 if(true) //使用布爾型常量true { document.write("<br><li>if語句中使用了布爾常量："+true);//輸出提示

} document.write("<li>八進制數值常量011輸出為十進制："+011);//使用八進制常量和十進制常量

document.write("<br><li>十六進制數值常量0xf輸出為十進制："+0xf);--></script> 常量和變量什么是常量常量和變量什么是變量顧名思義，變量是指在程序運行過程中值可以發生改變的量，更為專業的說法就是指可讀寫的內存單元。可以形象地將其理解為一個個可以裝載東西的容器，變量名代表著系統分配給它的內存單元

。

常量和變量什么是變量該代碼段演示了各種變量的定義方式。第3～5行定義三個不同類型的變量，定義時就已經賦予初始值，值的類型確定后變量的類型即可確定。第9～20行分別輸出各個變量中的值，發現m輸出為undefined。與m相關的“不明確”主要包含兩方面的含義，一是數據類型不明確，即未確定；其次是變量的值未確定。

常量和變量變量的作用域作用域是指有效范圍，JavaScript變量的作用域有全局和局部之分。全局作用域的變量在整個程序范圍都有效，局部作用域指作用范圍僅限于變量所在的函數體。JavaScript不像其他語言那樣有塊級作用域。變量同名時局部作用域優先于全局作用域。常量和變量變量的作用域<scriptlanguage="javascript"> //腳本程序開始<!-- varnA=10; //定義全局變量nA functionfunc() { varnA=20; //定義局部變量nA并輸出

document.write("<li>局部作用范圍的nA："+nA); //輸出nA } func(); //調用函數func document.write("<li>全局作用范圍的nA："+nA); //輸出全局nA--></script> 常量和變量JavaScript中的關鍵字什么是表達式什么是表達式表達式是產生一個結果值的式子，JavaScript中的表達式由常量、變量和運算符等組成。表達式可以作為參數傳遞給函數，或者將表達式結果賦予變量保存起來。表達式的結果值有多種類型，比如布爾型、字符串型或數值型等，因此常有邏輯表達式、數值表達式和布爾表達式之說。下面舉例說明如何定義和使用表達式。什么是表達式什么是表達式<scriptlanguage="javascript"><!-- varbalance=1000.0; //余額

varwillPay=300.0; //應支付數額：300 balance-=willPay; //當前余額

document.write("當前余額為："+balance); //輸出余額

varwillPay2=800; //再次支付數額：800 if(balance<willPay2) //當余額不足時

{ document.write((",不足以進行下次支付！").fontcolor("red"));//輸出提示信息

}--></script>認識運算符算術運算符簡介算術運算符是定義數學運算的符號，有數學意義的運算稱為算術運算。通常在數學表達式中使用，實現數值類型操作數間的數學計算。JavaScript中要包括加法、減法、乘法、除法、取模、正負號、遞增和遞減等。認識運算符算術運算符簡介<scriptlanguage="javascript"> //腳本程序開始<!-- varemployee1=200; //雇員數

varprize1=370; //每人獎金數額

varemployee2=70; //雇員數

varprize2=400; //每人獎金數額

varemployee3=30; //雇員數

varprize3=500; //每人獎金數額

document.write("共有員工數："+(employee1+employee2+employee3)); document.write("<p>"); vartotal=employee1*prize1+employee2*prize2+employee3*prize3; document.write("獎金總額為："+total+"元");--></script> 認識運算符關系運算符簡介

關系運算符比較兩個操作數大、小于或相等的運算符。返回一個布爾值，表示給定關系是否成立，操作數的類型可以任意。包括相等、等同、不等、不等同、小于、小于或等于、不小于、大于、大于或等于這幾種。認識運算符關系運算符簡介

該代碼段實現了支付頁面簡單的功能，主要驗證用戶的余額是否足以進行交易。第1行設置本頁普通字體的尺寸。第4、5行手工設定賬戶余額和該付數額。第8行生成一個按鈕，主要用于確認支付操作。第10～14行對余額進行判斷，如果夠用則啟用“確認支付”按鈕。否則該按鈕變灰，無法使用，使得余額不足時不能進行交易。

認識運算符字符串運算符簡介

前面講過了常見的數學運算符、關系運算符和一些特殊的運算符，本節將介紹與字符串相關的運算符。字符串也是一種數據，同樣也存在相應的計算，因此程序設計語言也為字符串定義了相應的運算符。運算符“+”，稱為連接運算符，它的作用是將兩個字符串按順序連接成為新的字符串。這大大簡化了字符串表達式的寫法

。認識運算符位運算符簡介

前面所講的邏輯與、邏輯或和邏輯非都是依據操作數的值轉換為布爾值后參與計算。例如，非零值為true，零值為false。而位運算符則對變量的二進制位間進行邏輯運算，因而取得一個新的值。位運算符包括位與、位或、位異或、位非和移位運算符。認識運算符其他運算符

前面講過算術運算符、關系運算符、字符串運算符等，這些是程序設計語言最基本的要素。但是程序設計語言不是純粹的數學計算和邏輯推理。因此程序設計語言還需要配備一些特殊的運算符用在一些特殊的場合。在JavaScript中就有條件運算符、new運算符、void運算符、typeof運算符、點運算符、數組存取運算符、delete運算符、逗號運算符、this運算符等等。這些運算符相當重要，希望讀者熟練掌握。運算符的優先級運算符的優先級JavaScript中的運算符優先級是一套規則。該規則在計算表達式時控制運算符執行的順序。具有較高優先級的運算符先于較低優先級的運算符得到執行。同等級的運算符按左到右的順序進行。運算符的優先級運算符的優先級JavaScript入門教程第4章控制語句課程安排選擇語句循環語句使用異常處理語句選擇語句If選擇生活中一個形象的例子，出門前看看窗外，如果下雨就帶傘，否則直接出門。編程中也有類似的問題，此時可用if語句來描述，其測試一個Boolean表達式，結果為真則執行某段程序。接下來介紹if語句的語法。if語句的第一種語法如下：if(<表達式>) //條件語句{ [語句組;] //程序語句序列}表達式：必需。執行時計算出一個Boolean值，若為真則執行語句組，否則不執行。語句組：可選。可由一條或多條語句組成。選擇語句If選擇<body> <h1> 當前時間：5點 </h1><scriptlanguage="javascript"> //腳本程序開始varhours=5; //設置一個值表示當前時間if(hours<6) //使用if語句進行判斷當前時間是否還不到6點{ //顯示一個消息框表示某人做的動作

alert("當前時間是"+hours+"點，還沒到6點，某人繼續睡！");}/*其他程序語句*/</script> </body> 選擇語句if-else選擇if語句僅根據表達式的值決定是否執行某個任務，沒有其他更多的選擇，而if-else語句則提供雙路選擇功能。其語法如下：if(<表達式>) //表達式成立時{ [語句組1;] //有效的程序語句}else //表達式不成立時{ [語句組2;] //有效的程序語句}選擇語句if-else選擇<body> <h1> 當前時間：7點</h1><scriptlanguage="javascript">varhours=7; //定義一個變量表示當前時間if(hours<6) //如果還沒到6點則繼續睡{alert("當前時間是"+hours+"點，還沒到6點，某人繼續睡！"); //輸出信息以表示繼續睡}else //否則起床準備上班{alert("當前時間是"+hours+"點，某人該準備上班了！"); //輸出信息以表示上班}</script> </body> 選擇語句if-else-if選擇當有多個可供判斷選擇的條件時，單個if-else語句顯然不能表達，于是有了if-else-if語句。嚴格地說，if-else-if不是單獨的語句，而是由多個if-else組合而成，實現多路判斷。語法如下：if(<表達式1>){ [語句組1;]}[elseif(<表達式2>){ [語句組2;]}else{ [語句組3;]}]選擇語句if-else-if選擇<scriptlanguage="javascript"> //腳本程序開始varhours=7; //手工設定當前時間if(hours<6) //如果還沒到6點則…{alert("當前時間是"+hours+"點，還沒到6點，某人繼續睡！"); //輸出信息以表示繼續睡}elseif(hours<8) //介于6~8點之間{alert("當前時間是"+hours+"點，某人決定吃飯早餐！");//輸出信息以表示吃早餐}</script> 選擇語句switch多條件選擇用if-else語句實現多路選擇結構使程序看起來不清晰，也不容易維護，于是可以選擇switch語句代替。switch實現多路選功能，在給定的多個選擇中選擇一個符合條件的分支來執行。語法如下：switch(<表達式>){case<標識1>: [語句組1;]case<標識2>: [語句組2;]…[default:] [語句組3;]}循環語句for循環遇到重復執行指定次數的代碼時，使用for循環比較合適。在執行for循環體中的語句前，有三個語句將得到執行，這三個語句的運行結果將決定是否要進入for循環體。for循環的一般語法如下：for([表達式1];[表達式2];[表達式3]){

語句組;}參數說明如下。表達式1，可選項，第一次遇到for循環時得到執行的語句。表達式2，可選項，每一輪執行for循環體前都要執行該表達式一次。如果該表達式返回true進入for循環體中執行語句組，否則直接跳到for循環體后的第一條語句。當本項省略時，皆返回true。表達式3，可選項，當語句組執行完畢后得到執行。語句組，可選項，是一些有效的需要重復執行的程序語句。循環語句for循環<body> <divstyle="width:261px;height:70px;background-color:#cccccc;"id="NameList"align="center"></div><scriptlanguage="javascript"> //腳本程序開始varnames=newArray("Lily","Tomson","Alex","Jack"); //名單for(i=0;i<names.length;i++) //遍歷名單{vartn=document.createTextNode(names[i]+""); //創建一個文本節點，內容為名單上當前名字varnameList=document.getElementById("NameList");//找出層NameListnameList.appendChild(tn); //將文本節點添加到層NameList上}</script> </body> 循環語句while循環當重復執行動作的情形比較簡單時，就不需要用for循環，可以使用while循環代替。while循環在執行循環體前測試一個條件，如果條件成立則進入循環體，否則跳到循環體后的第一條語句。語法如下：while(條件表達式){

語句組;}參數說明如下。條件表達式：必選項，以其返回值作為進入循環體的條件。無論返回什么樣類型的值，皆被作為布爾型處理，為真時進入循環體。語句組：可選項，一條或多條語句組成。循環語句while循環<scriptlanguage="javascript"> //腳本程序開始varnum=1;while(num<101) //若num小于101則繼續循環{ document.write(num+""); //輸出num加空格

num++; //num遞增}</script> 循環語句do-while循環while循環在進入循環前先測試條件表達式是否成立，而do-while循環則先執行一遍循環體。循環體內的語句執行之后再測試一個條件表達式，如果成立則繼續執行下一輪循環，否則跳到do-while代碼段后的第一條語句。語法如下：do{

語句組;}while(條件表達式);參數含義與while語句相同

。循環語句do-while循環<scriptlanguage="javascript"> //腳本程序開始varnum=1; //定義循環計數變量do //開始循環{document.write(num+""); //輸出計數變量加空格num++; //使num自增1，否則循環無法結束}while(num<101) //當num>=101時循環結束</script> 循環語句for-in循環for-in語句是for語句的一個變體，同樣是for循環語句，for-in通常用于遍歷某個集合的每個元素。比如數組有很多元素，其元素索引構成了一個集合。使用for-in語句可以遍歷該集合，進而取得所有元素數據。語法如下：for(ninset){

語句組;}n為集合set的一個元素，當set元素個數為0時不執行循環體。for-in語句在本書前面的內容中已經多次使用。循環語句break和continue跳轉一般情況下只要條件成立，循環體中的全部語句將得到執行，“停止循環”只會發生在條件表達式不成立時。為了能在循環體中直接控制循環中斷或進行下一輪循環，JavaScript提供了break和continue語句。break語句將無條件跳出并結束當前的循環結構，continue語句的作用是忽略其后的語句并結束此輪循環和開始新的一輪循環。這兩個語句直接使用在需要中斷的地方，沒有特別的語法。

使用異常處理語句

try-catchtry-catch語句是一個異常捕捉和處理代碼結構，當try塊中的代碼發生異常時，將由catch塊捕捉并處理，語法如下：try{tryStatements}catch(exception){catchStatements}參數說明如下。tryStatements：必選項。可能發生錯誤的語句序列。exception：必選項。任何變量名，用于引用錯誤發生時的錯誤對象。catchStatements：可選項。錯誤處理語句，用于處理tryStatements中發生的錯誤。使用異常處理語句

try-catch-finallytry-catch-finally語句作用與try-catch語句一樣，唯一的區別就是當所有過程執行完畢之后前者的finally塊無條件被執行。也就是說無論如何都會執行finally塊，語法如下：try{ tryStatements;}catch(exception){ handleStatements;}finally{ fianllyStatements;}使用異常處理語句

throw語句多個異常處理語句可以嵌套使用。當多個結構嵌套時，處于里層try-catch語句不打算自己處理異常則可以將其拋出。父級try-catch語句可以接收到子級拋出的異常，拋出操作使用throw語句。語法如下：throw表達式;表達式的值是作為錯誤信息對象傳出，該對象將被catch語句捕獲。throw語句可以使用在打算拋出異常的任意地方。JavaScript入門教程第5章函數和數組課程安排函數的定義函數的返回類型函數的分類函數的作用域數組的定義創建數組數組元素的基本操作數組對象的常見操作函數的定義函數的普通定義普通定義方式使用關鍵字function，也是最常用的方式，形式上跟其他編程語言一樣。語法格式如下：function函數名([參數1,[參數2,[參數N]]]){ [語句組]; [return[表達式]];}參數說明如下。function：必選項，定義函數用的關鍵字。函數名：必選項，合法的JavaScript標識符。參數：可選項，合法的JavaScript標識符，外部的數據可以通過參數傳送到函數內部。語句組：可選項，JavaScript程序語句，當為空時函數沒有任何動作。return：可選項，遇到此指令函數執行結束并返回，當省略該項時函數將在右花括號處結束。表達式：可選項，其值作為函數返回值。函數的定義函數的普通定義該代碼段完整地實現了一個數值加法函數Sum。第3～62行是Sum函數的定義，第5～60行主要實現參數驗證的功能，如果傳入的數據不是數值型則拋出錯誤信息。如果參數合法，則在第61行返回兩個數之和。

函數的定義函數的變量定義函數變量定義方式是指以定義變量的方式定義函數，JavaScript中所有函數都屬于Function對象。于是可以使用Function對象的構造函數來創建一個函數，語法如下：var變量名=newFunction([參數1,[參數2,[參數N]]],[函數體]);參數說明如下。變量名：必選項，代表函數名。是合法的JavaScript標識符。參數：可選項，作為函數參數的字符串，必須是合法的JavaScript標識符，當函數沒有參數時可以忽略此項。函數體：可選項，一個字符串。相當于函數體內的程序語句序列，各語句使用分號格開。當忽略此項時函數不執行任何操作。函數的定義函數的變量定義01 <scriptlanguage="javascript">02 varcircularityArea=newFunction("r","returnr*r*Math.PI");//創建一個函數對象03 varrCircle=2; //給定圓的半徑04 vararea=circularityArea(rCircle); //使用求圓面積的函數求面積05 alert("半徑為2的圓面積為："+area); //輸出結果06 </script>函數的定義指針調用除了前面介紹的直接調用函數之外，JavaScript中還有一種重要的、在其他語言中也經常使用的調用形式叫做回調，其機制是通過指針來調用函數。回調函數按照調用者的約定實現函數的功能，由調用者調用。通常使用在自己定義功能而由第三方去實現的場合，

函數的定義函數的參數函數的參數是函數與外界交換數據的接口。外部的數據通過參數傳入函數內部進行處理，同時函數內部的數據也可以通過參數傳到外界。如范例6-3中函數SortNumber的第一個參數就是典型的數據交換接口。函數定義時圓括號里的參數稱為形式參數，調用函數時傳遞的參數稱為實際參數。JavaScript的函數參數信息由arguments對象管理，函數的定義arguments對象arguments對象代表正在執行的函數和調用它的參數。函數對象的length屬性說明函數定義時指定的參數個數，arguments對象的length屬性說明調用函數時實際傳遞的參數個數。arguments對象不能顯式創建，函數在被調用時由JavaScript運行時環境創建并設定各個屬性值，其中包括各個參數的值。通常使用arguments對象來驗證所傳遞的參數是否符合函數要求。函數的返回類型值類型值類型返回的是數據本身的副本，相當于復制了一份傳遞出去。一般情況下，函數返回的非對象數據都使用值返回方式，如下面的代碼所示。01 functionsum(a,b) //加法函數02 {03 returna+b; //返回兩個數之和04 }05 varc=sum(1,2); //測試上面代碼中的函數sum返回的是一個值，表達式a+b的結果為3，3將被返回并存儲于變量c中。這是值傳遞方式，通常使用在返回的數據量比較小的時候，數據量比較大時使用另一種傳遞方式，即引用。

函數的返回類型引用類型引用類型返回的是數據的地址，而不是數據本身。引用傳遞的優點是速度快，但系統會為維護數據而付出額外的開銷。通常返回復合類型數據時使用引用傳遞方式，如下面代碼所示。functiongetNameList() //定義函數，以獲取名單{ varList=newArray(“Lily”,“Petter”,“Jetson”); //名單

returnList; //返回名單引用}varnameList=getNameList(); //測試nameList=null; //刪除引用函數的返回類型使用返回函數前面討論的返回值都是數據本身或數據地址，然而函數可以返回一個函數指針。外部代碼可以通過指針調用其引用的函數對象，調用方式和一般函數完全一樣。一般情況下私有函數不能被外界直接調用，因此可以將一個私有函數的地址作為結果返回給外界使用，如下面代碼所示。functiongetSum() //定義加法函數{ functionsum(a,b) //定義私有函數

{ returna+b; //返回兩個數之和

} returnsum; //返回私有函數的地址}varsumOfTwo=getSum(); //取得私有函數地址vartotal=sumOfTwo(1,2); //求和上面代碼中函數getSum將其內部的函數sum的地址當做返回值返回，第9行通過調用getSum獲得sum函數的指針。第10行通過指針調用sum函數，求兩個值的和。函數的分類構造函數構造函數是類用于創建新對象的函數，一般在此函數中對新建的對象做初始化工作。JavaScript是基于對象而不是真正面向對象的語言，它沒有類的概念，完成一個對象“類”的定義僅僅需要定義一個構造函數即可。如下面的代碼所示，定義一個構造函數Employee用于創建雇員對象。functionEmployee(name,sex,adr) //雇員對象的構造函數{=name; //姓名屬性

this.sex=sex; //性別屬性

this.address=adr; //地址屬性

this.getName=getName; //方法：取得雇員姓名}functiongetName() //定義普通函數作為Employee對象的方法{return; //返回當前name屬性}vare=newEmployee("sunsir","男","貴州貴陽"); //使用構造函數創建一個雇員對象varn=e.getName(); //調用雇員對象的方法函數的分類有返回值的函數

有返回值函數是指函數執行結束時將有一個結果返回給調用者的函數，如下面代碼中所定義的函數。mul函數實現求兩個數的積的功能，兩個數相乘后勢必有一個結果值產生，因此函數結束時應該將結果返回給調用者。01 functionmul(arg1,arg2) //定義實現乘法的函數02 {03 returnarg1*arg2; //返回兩個數相乘的積04 }函數的分類無返回值的函數

無返回值函數是指函數執行結束后不返回結果的函數。例如，下面的代碼中所定義的setStatusMessage函數，該函數僅設置瀏覽器窗口的狀態欄文本信息，無須返回結果值。01 functionsetStatusMessage(text) //設置狀態欄信息02 {03 window.status=text; //設置狀態欄信息文本04 }函數的作用域

公有函數的作用域

公有函數是指定義在全局作用域中，每一個代碼都可以調用的函數。例如，大家公有的物品，理論上誰都可以看得到，每個人都可以去使用。前面的例子代碼所定義的函數都是公有函數，每一個地方都可以調用，這也是最常用的方法。

函數的作用域公有函數的作用域<scriptlanguage="javascript">functionGetType(obj) //本函數處于頂級作用域，用于求操作數的類型

{returntypeof(obj); //返回對象的類型

}functionfruit(name,price) //水果類構造函數

{if(GetType(price)!="number") //調用頂級作用域中的函數GetType{vare=newError(); //定義錯誤信息對象

e.message="Priceifnotanumber"; //填寫錯誤描述

throwe; //拋出錯誤對象

}}varapple=newfruit("apple",2.0); //測試</script>函數的作用域

私有函數的作用域

私有函數是指處于局部作用域中的函數。當函數嵌套定義時，子級函數就是父級函數的私有函數。外界不能調用私有函數，私有函數只能被擁有該函數的函數代碼調用。

函數的作用域

使用this關鍵字this關鍵字引用運行上下文中的當前對象，JavaScript的函數調用通常發生于某一個對象的上下文中。如果尚未指定當前對象，則調用函數的默認當前對象是Global，使用call方法可以改變當前對象為指定的對象。

函數的作用域使用this關鍵字<body> <h1>this關鍵字測試</h1> <scriptlanguage="javascript">varchair="公園里的椅子"; //公物，誰都可以用

functionTomHome() //湯姆的家

{this.chair="湯姆家的椅子"; //湯姆家的椅子

}functionuseChair() //使用椅子

{document.write("<li>此時使用的是："+this.chair+"<br>");//輸出當前椅子信息

}varth=newTomHome(); //生成一個新“家”實例

useChair(); //當前所在的場景是公園里

useChair.call(th); //當前所在的場景是湯姆家</script> </body> <!--文檔體結束--數組的定義

數組的定義avaScript數組是指將多個數據對象編碼存儲、提供一致的存取方式的集合。每個數據對象都是數組的一個元素，通過數組對象的有關方法添加到數組中并為之分配一個唯一的索引號。與其他程序語言不同的是，JavaScript的數組元素的數據類型可以不相同。在JavaScript中，幾乎所有數據存儲相關的工作都由數組來完成。作為一種常用的數據容器，JavaScript本身不能完成文件讀寫的操作，因此選擇數組來組織數據比較合適，接下來將逐一介紹數組的相關知識。創建數組

創建空數組數組在創建時可以不包含任何元素數據，即空數組。創建后返回一個數組對象，使用該對象可以往數組中添加元素。語法如下：varObj=newArray();上面語句將創建一個空數組。變量Obj引用創建后的數組對象，通過此變量可以操作數組，Array()為數組對象的構造函數。創建數組

指定數組長度創建新數組

數組的元素個數稱為數組的長度，數組對象的length屬性指示數組的長度。在創建數組時可以指定數組的元素個數，通過這種方式可以創建一個有指定元素個數的數組對象。數組的長度信息在需要遍歷數組時派上用場，比如有5個元素的數組，通過5次迭代操作即可讀取所有元素。語法如下：varObj=newArray(Size);Size指明新建的數組有多少個元素。數組對象的length將被設置為Size，僅指定長度但沒有實際填充元素及其數據的數組將得不到數據存儲空間。例如，某個人向酒店約定使用5個房間，但一直沒去用，也沒到過酒店。那5個房間實際上不會被分配，僅當真正去使用房間時才會發生分配活動。創建數組

指定數組元素創建新數組

創建數組的一個最為常用的方法是通過直接指定數組的元素來創建。新建的數組將包含創建時指定的元素，通常用在數據已經準備就緒的場合。語法如下：varObj=newArray(元素1,元素2,…,元素N);創建數組指定數組元素創建新數組<body> <h1>通過指定元素創建數組</h1> <scriptlanguage="javascript"> //腳本程序開始

varstudents=newArray("Peter","Tom","Vicky","Jet"); //通過指定元素創建數組

for(ninstudents) //逐個輸出數組中的名字

{document.write(students[n]+""); //將名字寫入當前文檔流中

}</script> </body> 創建數組

直接創建新數組

JavaScript創建數組的另一種簡便方式是使用“[]”運算符直接創建，數組的元素也是創建時被指定的。這種方法的目標也是創建數組，與前面的方法相比僅僅是語法上的不同。語法如下：varObj=[元素1,元素2,元素3,…,元素N];這種方法的語法十分簡潔，使用這種方法創建示例7-1中的students數組代碼如下：varstudents=["peter","Tom","Vicky","Jet"];數組元素的基本操作

讀取數組元素

讀取數組元素最簡單的方法就是使用“[]”運算符，此運算符在第4章已經講過。使用“[]”運算符可以一次讀取一個數組元素，語法如下：數組名[下標索引];目標元素通常由下標索引號決定，如讀取第一個元素為“數組名[0]”，依此類推。下面的代碼從一個填有商品名字的數組中讀出第二種商品的名字。varproducts=newArray("洗衣粉","香皂","洗潔精"); //商品列表varproduct=products[1]; //取出第二種商品數組元素的基本操作

添加數組元素

JavaScript的數組可以動態添加新元素，也可以動態刪除原有的元素，下一節將講解如何刪除。添加新元素通常使用Array對象的push方法，push方法是將新元素添加到數組的尾部。使用unshift可以將指定個數的新元素插入數組的開始位置，形成新的數組。后面的內容將詳細介紹這兩個方法，下面的代碼演示添加元素的一般形式。varstudents=newArray(); //創建一個沒有任何元素的數組students.push("Lily"); //將Lily的名字添加到數組中數組元素的基本操作

刪除數組元素

數組元素可以動態刪除，余下的元素按原順序重新組合為新數組，下標也將被重新按從零開始順序賦予給每個元素。通常使用delete運算符刪除一個指定的元素，如果需要刪除全部元素只需要刪除數組對象即可。使用語法如下：delete數組名[下標];例如，使用數組作為學生名單，現要刪除數組中第一個元素，代碼如下：varnames=Array("李莉","楊楊"); //有兩個名字的名單deletenames[0]; //刪除第一個名字“莉莉”數組元素的基本操作

獲取數組元素的個數前面提過數組對象的length（長度）屬性，該屬性指示了數組元素的個數。通過設定length屬性可以指定數組的長度。在得知長度情況下可以方便地遍歷整個數組，讀取數組元素個數信息的方法如下所示。varObj=newArray(1,2,3);varcount=Obj.length;數組對象的常見操作

數組轉換為字符串

toString方法將數組表示為字符串，各個元素按順序排列組合成為字符串返回。這個方法是從Object對象繼承而來，通常使用在全部輸出數組數據的場合，數組中的所有元素按順序組成一個字符串。語法如下：對象名.toString([radix]);radix為可選參數，表示進制。當對象是數字對象時，該參數起作用。對象名是數組對象變量名，方法執行后各元素以“，”隔開按順序加入字符串中，現舉例說明toString方法的特性。數組對象的常見操作數組轉換為字符串<body> <h1>toString方法的使用</h1> <scriptlanguage="javascript"> //腳本程序開始

varnames=["Peter","Vicky","LuWang","HuaLi"]; //名字數組

document.write(names.toString());//輸出所有名字</script> </body> 數組對象的常見操作

數組元素連接成字符串

上一節介紹的toString方法是將數組所有元素使用“，”分隔符組合為字符串，分隔符固定不變。如果需要指定連接符號則可以使用join方法，該方法同樣是將各元素組合為字符串，但連接符號由用戶指定。語法如下：數組名.join(分隔符);參數說明如下。數組名：必選項，是一個有效的數組對象名。分隔符：必選項，是一個字符串對象，作為各元素間的分隔字符串。數組對象的常見操作數組元素連接成字符串<body> <h1>join方法的使用</h1> <scriptlanguage="javascript"> //腳本程序開始

varnames=["Peter","Vicky","LuWang","HuaLi"]; //名字數組

document.write(names.join("-")); //輸出所有名字</script> </body> 數組對象的常見操作

在數組尾部添加元素

添加數組元素最直接的辦法是使用push方法，一次可以添加單個元素或多個元素到數組末端。如果添加的元素是數組，則僅將數組對象的引用添加為原數組的一個元素，而不是所有元素添加至其中。push方法很方便地動態添加新元素到數組中，使用語法如下：數組名.push([元素1,[元素2,[…,[元素N]]]]);參數說明如下。數組名：必選項，有效的數組對象的變量名，新元素將添加到此數組中。元素：可選項，可以是一個或多個JavaScript對象，使用“，”分隔。push是數組動態添加元素的最主要方法。數組對象的常見操作

刪除數組的最后一個元素

pop方法的作用是移除數組末尾的一個元素。前面講過使用delete運算符刪除指定的元素，與delete不同，pop方法刪除最后一個元素后還將其引用返回。堆棧有先進后出（FILO）的特點，pop通常結合push方法一起使用，實現類似堆棧的功能。pop方法語法如下：數組名.pop();數組名是一個有效的數組對象變量名，必選項

。數組對象的常見操作刪除數組的最后一個元素<scriptlanguage="javascript"> //腳本程序開始

varappleBox=newArray(); //使用數組作為蘋果箱

appleBox.push("紅蘋果1","紅蘋果2","紅蘋果3","紅蘋果4","紅蘋果5","紅蘋果6");//蘋果裝箱

for(;appleBox.length!=0;) //分發蘋果，直到箱子是空的

{varhandle=appleBox.pop(); //從數組（箱）中彈出一個蘋果

document.write("<br>已發："+handle); //輸出

}alert("蘋果已經分光~！"); //分光時</script> 數組對象的常見操作

其他常見操作Concat()方法多個數組連在一起。Splice()方法從一個數組中移除一個或多個元素。Slice()方法切除數組一段元素，返回新數組。Sort()方法對數組進行排序JavaScript入門教程第6章JavaScript的調試與優化課程安排JavaScript開發工具深入剖析JavaScript的調試簡介輸出日志

優化代碼

JavaScript開發工具深入剖析開發工具深入剖析JavaScript代碼不需要編譯，也無須引入復雜的外部源程序。程序的編寫過程非常簡單，使用一個文本編輯工具即可完成工作。但事實表明，有一個強大的開發工具可以大大提高開發效率。于是各種各樣輔助開發的工具由此產生，本節將向讀者介紹一款強大的開發工具，即MicrosoftVisualStudio2010（下文簡稱VS2010），它是一套功能強大的開發套件，對Web開發也提供了強大的支持。JavaScript的調試簡介調試前的準備工作

一、打開IE瀏覽器，選擇菜單欄“工具”|“Internet選項”命令，打開“Internet選項”對話框，如圖6-2所示。二、單擊“高級”選項卡，拖動“設置”列表框的垂直滾動條。在“設置”列表框中找到兩個“禁用腳本調試”復選框，將它們前面的鉤去掉。最后單擊“確定”按鈕確認修改并退出，如圖6-2所示。JavaScript的調試簡介進行調試

正確安裝VS2010和設置IE瀏覽器后，可以開始調試JavaScript程序。把將要調試的JavaScript程序加載到IE瀏覽器中，再啟動調試，操作步驟如下：一、在IE中打開包含JavaScript程序的HTML網頁，選擇菜單欄“工具”|“開發人員工具”命令，打開“開發人員工具”對話框，如圖6-3所示。提示：以上工具只有在IE8以上版本中才有。二、在工具欄中選擇“腳本”調試，單擊“啟動調試”按鈕進入調試。JavaScript的調試簡介跟蹤代碼

當程序處于調試狀態時，按F9鍵在當前光標處設置或移除斷點。程序運行到斷點處被掛起，也就是說使程序暫停執行但并不將它關閉，以方便查看程序的各個狀態，設置斷點的具體操作如下：1、在代碼編輯器窗口中，將光標移動到需要添加斷點的行上。2、按一次F9鍵，當前行的背景色變為紅色，并且在窗口左邊界上標上紅色的圓點。當程序在斷點處暫停的時候，只要按一下F5、F10或F11鍵就可以繼續向下執行，看具體的需要來操作。按F10鍵可以逐過程執行，按F11鍵可以逐語句執行。3、將鼠標移動到源代碼編輯窗口中的變量名上時，鼠標光標處將顯示變量當前時刻的值。單擊變量信息框中的變量值可以修改變量的當前值，如

人人文庫> 全部分類> 教育資料 > 課件下載

溫馨提示

1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

老太爷的乳妓h开裆裤,久久久久久精品国产三级非禁歌 ,久久久久久久99精品国产片,免费观看交性大片

JavaScript入門教程-全套課件

文檔簡介

溫馨提示

最新文檔

評論

老太爷的乳妓h开裆裤,久久久久久精品国产三级非禁歌 ,久久久久久久99精品国产片,免费观看交性大片

JavaScript入門教程-全套課件

文檔簡介

溫馨提示

最新文檔

評論

相關文檔