JavaScript第二課(修改)

1、知知不如好知，好知不如樂知 JavaScript JavaScript課程第二課課程第二課JavaScriptJavaScript語言基礎(chǔ)語言基礎(chǔ)知知不如好知，好知不如樂知知識(shí)回顧 聲明一個(gè)變量x，初值為10，對(duì)應(yīng)的js代碼？ alert(10“30”)；顯示為什么效果？ 將字符串轉(zhuǎn)換為整數(shù)，使用哪個(gè)函數(shù)？var x=“c”，var y;switch（x） case “a”: y=5; case b : y=6; default: y=0;指出代碼錯(cuò)誤知知不如好知，好知不如樂知內(nèi)容摘要 使用循環(huán)語句控制應(yīng)用程序 創(chuàng)建自定義函數(shù) 理解 JavaScript 對(duì)象 使用 String、Math 和

2、 Date 等對(duì)象 使用數(shù)組知知不如好知，好知不如樂知案例摘要 for 打印金字塔直線 do while 漂亮的埃及圖像 eval 簡(jiǎn)易計(jì)算器 Date 在線時(shí)鐘 Math 隨機(jī)漂浮的圖片知知不如好知，好知不如樂知循環(huán) for循環(huán) do-while while 知知不如好知，好知不如樂知q for循環(huán)例：var i;for (i=0; i10; i+) / 語句; for 循環(huán)如何實(shí)現(xiàn)知知不如好知，好知不如樂知For 循環(huán)演示document.write(打印金字塔直線);for (var i= 0; i100; i=i+5) document.write();for 循環(huán)當(dāng)i=5 時(shí)，知知不

3、如好知，好知不如樂知qwhile循環(huán) while(循環(huán)條件) /語句； qdowhile循環(huán) do /語句； while(循環(huán)條件);while和dowhile循環(huán)先執(zhí)行，后判斷循環(huán)條件先執(zhí)行，后判斷循環(huán)條件知知不如好知，好知不如樂知 .myfont font-size:150px; color:#c99c96; font-family:Webdings /產(chǎn)生埃及圖像的特殊字體產(chǎn)生埃及圖像的特殊字體 document.write(每個(gè)字符都對(duì)應(yīng)一個(gè)漂亮的埃及圖像每個(gè)字符都對(duì)應(yīng)一個(gè)漂亮的埃及圖像);do var c = prompt(輸入一個(gè)字符，輸入輸入一個(gè)字符，輸入N 或或n停止停止,A)

4、 ; document.write (+c+); while (c !=N & c !=n);while和dowhile循環(huán)輸入一個(gè)字符，直到N停止，用哪個(gè)循環(huán)知知不如好知，好知不如樂知JavaScript 函數(shù) 函數(shù)實(shí)際上就是一段有名字的程序有名字的程序，這樣，在整個(gè)程序的任何位置，只要使用該名字，就會(huì)執(zhí)行由這段名字命名的程序。 JavaScript使用函數(shù)的目的有兩個(gè)有兩個(gè) 為了更好地組織程序，當(dāng)需要重復(fù)地使用一段程序時(shí)，就應(yīng)該將這段程序?qū)懗珊瘮?shù)。 用于網(wǎng)頁中的事件處理。知知不如好知，好知不如樂知JavaScript 函數(shù)內(nèi)置函數(shù)內(nèi)置函數(shù) eval 函數(shù)： 用于計(jì)算字符串表達(dá)式的值計(jì)算字符

5、串表達(dá)式的值 該函數(shù)可以對(duì)以字符串形式表示的任意有效的 JavaScript代碼求值。eval() 函數(shù)有一個(gè)參數(shù)，該參數(shù)就是想要求值的代碼。 var anExpression = 6 * 9 % 7; var total = eval(anExpression); / 將變量 total 賦值為 5知知不如好知，好知不如樂知isNaN 函數(shù)：用于驗(yàn)證參數(shù)是否為用于驗(yàn)證參數(shù)是否為 NaN（非數(shù)字）（非數(shù)字） isNaN(numValue) 返回一個(gè) Boolean 值，指明提供的值是否是保留值 NaN （不是數(shù)字）。 如果值是 NaN， 那么 isNaN 函數(shù)返回 true ，否則返回 fal

6、se 知知不如好知，好知不如樂知var str1=prompt(“輸入一個(gè)表達(dá)式，我給您計(jì)算,1+1);var result=eval(str1); document.write(str1+=+result);var x = prompt(輸入一些數(shù)據(jù),0);if (isNaN(x) alert (x + 不是一個(gè)數(shù)字);else alert (x + 是一個(gè)數(shù)字);知知不如好知，好知不如樂知自定義函數(shù) 定義函數(shù)：function 函數(shù)名(參數(shù)1,參數(shù)2，) 語句; 調(diào)用函數(shù)調(diào)用函數(shù)：函數(shù)調(diào)用一般和表單元素的事件一起使用，調(diào)用格式為：事件名“函數(shù)名” ;function sum ( one,

7、two) var result = one + two; return result;表示單擊此按鈕時(shí)，調(diào)用函數(shù)sum( )執(zhí)行關(guān)鍵字必須唯一，并且大小寫有區(qū)別參數(shù)是可選項(xiàng)，當(dāng)使用多個(gè)參數(shù)時(shí)，參數(shù)間用逗號(hào)隔開知知不如好知，好知不如樂知函數(shù)的應(yīng)用 num1num2result知知不如好知，好知不如樂知定義函數(shù) JavaScript 代碼 function compute(op) var num1,num2; num1=parseFloat(document.myform.num1.value); num2=parseFloat(document.myform.num2.value); if (o

8、p=+)document.myform.result.value=num1+num2 ; if (op=-)document.myform.result.value=num1-num2 ; if (op=*)document.myform.result.value=num1*num2 ; if (op=/ & num2!=0)document.myform.result.value=num1/num2 ; 定義函數(shù)compute( )，完成計(jì)算的功能。op參數(shù)代表運(yùn)算符號(hào) 知知不如好知，好知不如樂知調(diào)用函數(shù) 第一個(gè)數(shù) 第二個(gè)數(shù) 計(jì)算結(jié)果 知知不如好知，好知不如樂知函數(shù)的參數(shù) 參數(shù)是由函數(shù)的使用

9、方傳遞到函數(shù)體中的變量，用于為函數(shù)中的操作提供相應(yīng)的信息和數(shù)據(jù)。 參數(shù)的傳遞參數(shù)的傳遞 按值傳遞：按值傳遞：傳遞的只是原變量的一份拷貝，因此，如果在函數(shù)中改變了這個(gè)參數(shù)的值，原變量不會(huì)跟著改變，它將保留原有的值。 按地址傳遞：按地址傳遞：這時(shí)傳遞的是原變量的內(nèi)存地址，即函數(shù)中的參數(shù)和原變量是同一個(gè)變量。因此在函數(shù)中改變了參數(shù)值，原變量也會(huì)隨之改變。(對(duì)象，數(shù)組，函數(shù))注意：如果參數(shù)的數(shù)據(jù)類型是對(duì)象，其傳遞方式按地址傳遞的如果參數(shù)的數(shù)據(jù)類型是對(duì)象，其傳遞方式按地址傳遞的知知不如好知，好知不如樂知函數(shù)的參數(shù) 參數(shù)的個(gè)數(shù)參數(shù)的個(gè)數(shù)當(dāng)函數(shù)包含多個(gè)參數(shù)時(shí)，使用arguments.length可以得到可以

10、得到使用該函數(shù)時(shí)使用該函數(shù)時(shí)輸入的參數(shù)個(gè)數(shù)輸入的參數(shù)個(gè)數(shù)，而arguments包括了各參包括了各參數(shù)內(nèi)容。數(shù)內(nèi)容。 注意：調(diào)用有參數(shù)的函數(shù)，但沒有給其傳值，函數(shù)一樣可調(diào)用有參數(shù)的函數(shù)，但沒有給其傳值，函數(shù)一樣可以運(yùn)行，或者調(diào)用沒有參數(shù)的函數(shù)，給其傳值，該函數(shù)也以運(yùn)行，或者調(diào)用沒有參數(shù)的函數(shù)，給其傳值，該函數(shù)也一樣運(yùn)行。一樣運(yùn)行。 說的簡(jiǎn)單點(diǎn)：只要寫了函數(shù)名后面跟了一對(duì)小括號(hào)，該函只要寫了函數(shù)名后面跟了一對(duì)小括號(hào)，該函數(shù)就會(huì)運(yùn)行。數(shù)就會(huì)運(yùn)行。那么傳遞的參數(shù)呢？知知不如好知，好知不如樂知其實(shí)，在函數(shù)中有一個(gè)參數(shù)數(shù)組對(duì)象（arguments），該對(duì)象將傳遞的參數(shù)都封裝在一個(gè)數(shù)組中。例：functio

11、n demo()/定義函數(shù)。alert(arguments.length);demo(“hello”,123,true);/調(diào)用函數(shù)。那么彈出的對(duì)話框結(jié)果是3，如果想得到所有的參數(shù)值，可以通過for循環(huán)遍歷該數(shù)組。為了增強(qiáng)閱讀性，最好按照規(guī)范，按定義好的形式參數(shù)傳遞實(shí)際參數(shù)。知知不如好知，好知不如樂知函數(shù)在調(diào)用時(shí)的其他寫法：var show = demo();/show變量接收demo函數(shù)的返回值。var show = demo;/這種寫法是可以的，意為show和demo代表同一個(gè)函數(shù)。 /那么該函數(shù)也可以通過show()的方式運(yùn)行。知知不如好知，好知不如樂知變量的作用域 JavaScript

12、的變量分為全局變量和局部變量。全局變量是作用在全程序范圍內(nèi)的變量，它聲明在函數(shù)體外；局部變量是定義在函數(shù)體內(nèi)的變量，它僅僅在函數(shù)體內(nèi)起作用。例如， var errorMessage=“”;function checkRequired(v,label) var msg=“請(qǐng)輸入”+label;errorMessage=errorMessage+msg;知知不如好知，好知不如樂知作業(yè)：1. 有五個(gè)數(shù)字分別是：5，13，50，17，20。請(qǐng)編寫程序輸出最大值、最小值。2. 利用循環(huán)編寫程序輸出右邊圖形3. 計(jì)算1！+2！+20！#*#*# # # # # # * * *# # # # # * * *

13、 *# # # # * * * * *# # # * * * * * *# # * * * * * * *# * * * * * * * *知知不如好知，好知不如樂知作業(yè)：4.把一張?jiān)垘艙Q成一分、二分和五分的硬幣，假如每種至少一枚，問可以有多少種換法？編寫程序統(tǒng)計(jì)并顯示共有多種換法。在上題基礎(chǔ)上統(tǒng)計(jì)循環(huán)次數(shù)，并嘗試改進(jìn)程序減少循環(huán)次數(shù)。知知不如好知，好知不如樂知JavaScript 對(duì)象簡(jiǎn)介 2-1對(duì)象是屬性和/方法的組合 屬性是對(duì)象所擁有的一組外觀特征，一般為名詞 方法是對(duì)象可以執(zhí)行的功能，一般為動(dòng)詞 例如：汽車Ferrari對(duì)象：汽車屬性：型號(hào)：法拉利顏色：綠色方法：前進(jìn)、剎車、倒車知知

14、不如好知，好知不如樂知JavaScript 對(duì)象簡(jiǎn)介 2-1 內(nèi)置對(duì)象內(nèi)置對(duì)象 瀏覽器對(duì)象 自定義對(duì)象 注意：一個(gè)對(duì)象在被引用之前，必須存在。另外在JavaScript中對(duì)于對(duì)象屬性和方法的引用，有兩種情況： 該對(duì)象為靜態(tài)對(duì)象，表示在引用該對(duì)象的屬性或方法時(shí)不需要為它創(chuàng)建實(shí)例； 在引用該對(duì)象屬性和方法時(shí)必須為它創(chuàng)建一個(gè)實(shí)例，叫做動(dòng)態(tài)對(duì)象。 知知不如好知，好知不如樂知String 對(duì)象創(chuàng)建字符串有兩種不同方法 ： 使用 var 語句 var newstr = “這是我的字符串這是我的字符串 創(chuàng)建 String 對(duì)象var newstr = new String (“這是我的字符串這是我的字符串)

15、 字符串相加：+或+= （字符串的連接） 在字符串中使用特殊字符“sdfg “她說：今天不出門” 或使用轉(zhuǎn)義字符或使用轉(zhuǎn)義字符 “她說：她說：”今天不出門今天不出門” “n” 比較字符串是否相等 = != user=null | user=“” 數(shù)字字符串和數(shù)值的相互轉(zhuǎn)換知知不如好知，好知不如樂知String相關(guān)函數(shù) 屬性：length 方法： charAt(index): 返回指定索引位置處的字符。 indexOf(subString, startIndex): 返回 String 對(duì)象內(nèi)第一次出現(xiàn)子字符串的字符位置。 substr(start , length ):返回一個(gè)從指定位置開始的

16、指定長(zhǎng)度的子字符串。 substring(start, end):返回位于 String 對(duì)象中指定位置的子字符串。 toLowerCase:返回一個(gè)字符串，該字符串中的字母被轉(zhuǎn)換為小寫字母。知知不如好知，好知不如樂知Math 對(duì)象 2-1名稱名稱 說說 明明屬性PI 的值， 約等于 3.1415LN1010 的自然對(duì)數(shù)的值，約等于 2.302EEuler 的常量的值，約等于 2.718。Euler 的常量用作自然對(duì)數(shù)的底數(shù)abs(y)返回 y 的絕對(duì)值sin (y) 返回 y 的正弦，返回值以弧度為單位。cos (y)返回 y 的余弦，返回值以弧度為單位tan (y)返回 y 的正切，返回值

17、以弧度為單位 min (x, y)返回 x 和 y 兩個(gè)數(shù)中較小的數(shù) max (x, y)返回 x 和 y 兩個(gè)數(shù)中較大的數(shù) random返回0-1的隨機(jī)數(shù)方法round (y)四舍五入取整sqrt (y)返回 y 的平方根Math.random( ) ：產(chǎn)生：產(chǎn)生01的隨機(jī)小數(shù)的隨機(jī)小數(shù)Math.round( )：四舍五入取整，如：四舍五入取整，如9.34 取整為取整為9知知不如好知，好知不如樂知數(shù)學(xué)運(yùn)算 Math對(duì)象 Math.ceil(x)返回=x的最小整數(shù) Math.floor(x) 返回=x的最大整數(shù) Math.pow(x,y)返回x的y次方 Math.random()返回0-1之間

18、的隨機(jī)小數(shù) Math.round(x)返回x的四舍五入的整數(shù)，特定精度的四舍五入知知不如好知，好知不如樂知自動(dòng)刷新 document.write(2秒自動(dòng)刷新，隨機(jī)顯示圖片); var i=0; i=Math.round(Math.random( )*8+1); document.write(); Math 對(duì)象 2-2假定隨機(jī)產(chǎn)生的數(shù)字i=3，上述代碼即為：顯示第三幅圖片（3.jpg） 如何實(shí)現(xiàn)每隔2秒刷新網(wǎng)頁Math.round(Math.random( )*8+1) 產(chǎn)生1-9的數(shù)字知知不如好知，好知不如樂知Date 對(duì)象10-2 Data 方法的分組： 方法分組方法分組說說 明明 se

19、txxx這些方法用于設(shè)置時(shí)間和日期值getxxx 這些方法用于獲取時(shí)間和日期值Toxxx這些方法用于從 Date 對(duì)象返回字符串值p a r s e x x x & UTCxx這些方法用于解析字符串知知不如好知，好知不如樂知Date 對(duì)象10-3 用作 Date 方法的參數(shù)的整數(shù)： 值值整整 數(shù)數(shù) Seconds 和和 minutes0 至至 59 Hours0 至至 23 Day0 至至 6（星期（星期幾）幾） Date1 至至 31（月份中的天數(shù)）（月份中的天數(shù)） Months0 至至 11（一月（一月至十二月）至十二月） 知知不如好知，好知不如樂知Date 對(duì)象10-4 Set 方法：方

20、法方法說明說明setDate設(shè)置 Date 對(duì)象中月份中的天數(shù)，其值介于 1 至 31 之間。setHours設(shè)置 Date 對(duì)象中的小時(shí)數(shù)，其值介于 0 至 23 之間。setMinutes設(shè)置 Date 對(duì)象中的分鐘數(shù)，其值介于 0 至 59 之間。 setSeconds設(shè)置 Date 對(duì)象中的秒數(shù)，其值介于 0 至 59 之間。 setTime設(shè)置 Date 對(duì)象中的時(shí)間值。 setMonth設(shè)置 Date 對(duì)象中的月份，其值介于 1 至 12 之間。知知不如好知，好知不如樂知Date 對(duì)象10-5 Get 方法：方法方法說明說明getDate返回 Date 對(duì)象中月份中的天數(shù)，其值介于

21、 1 至 31 之間getDay返回 Date 對(duì)象中的星期幾，其值介于 0 至 6 之間getHours返回 Date 對(duì)象中的小時(shí)數(shù)，其值介于 0 至 23 之間getMinutes返回 Date 對(duì)象中的分鐘數(shù)，其值介于 0 至 59 之間getSeconds 返回 Date 對(duì)象中的秒數(shù)，其值介于 0 至 59 之間getMonth返回 Date 對(duì)象中的月份，其值介于 0 至11 之間getFullYear返回 Date 對(duì)象中的年份，其值為四位數(shù)getTime返回自某一時(shí)刻（1970 年 1 月 1 日）以來的毫秒數(shù)知知不如好知，好知不如樂知Date 對(duì)象10-6方方 法法說說 明

22、明 ToGMTString使用格林尼治標(biāo)準(zhǔn)時(shí)間 (GMT) 數(shù)據(jù)格式將 Date 對(duì)象轉(zhuǎn)換成字符串表示ToLocaleString使用當(dāng)?shù)貢r(shí)間格式將 Date 對(duì)象轉(zhuǎn)換成字符串表示 To 方法： Parse 方法和 UTC 方法 方方 法法說說 明明Date.parse (date string )用日期字符串表示自 1970 年 1 月 1 日以來的毫秒數(shù) Date.UTC (year, month, day, hours, min., secs. )Date 對(duì)象中自 1970 年 1 月 1 日以來的毫秒數(shù) 知知不如好知，好知不如樂知var now= new Date( );var ho

23、ur = now.getHours( );if (hour=0 & hour 12 & hour18 & hour 24) document.write(晚上好!);document.write(今天日期:+now.getYear()+年“ +(now.getMonth( )+1)+月+now.getDate()+日);document.write(現(xiàn)在時(shí)間:+now.getHours()+點(diǎn)+now.getMinutes( )+分); Date對(duì)象 10-7如何實(shí)現(xiàn)獲得當(dāng)前日期和時(shí)間獲得小時(shí)，即當(dāng)前是幾點(diǎn)判斷上午、下午還是晚上月份數(shù)字011，注意1知知不如好知，好知不如樂知Date 對(duì)象10

24、-9JavaScript 代碼function disptime( ) var time = new Date( ); /獲得當(dāng)前時(shí)間 var hour = time.getHours( ); /獲得小時(shí)、分鐘、秒 var minute = time.getMinutes( ); var second = time.getSeconds( ); var apm=AM; /默認(rèn)顯示上午: AM if (hour12) /按12小時(shí)制顯示 hour=hour-12; apm=PM ; if (minute 10) /如果分鐘只有1位，補(bǔ)0顯示 minute=0+minute; if (second

25、 10) /如果秒數(shù)只有1位，補(bǔ)0顯示 second=0+second;document.myform.myclock.value= hour+:+minute+:+ second+ +apm;var myTime = setTimeout(disptime( ),1000);使用定時(shí)器函數(shù)，每隔1秒調(diào)用disptime( )函數(shù)刷新顯示獲得小時(shí)、分鐘、秒根據(jù)12小時(shí)制調(diào)整時(shí)間和AM/PM標(biāo)志確保分鐘和秒顯示位數(shù)為 2 位var myTime = setTimeout(disptime( ),1000);設(shè)置定時(shí)器每隔1秒（1000毫秒），調(diào)用函數(shù)disptime( )執(zhí)行，刷新時(shí)鐘顯示 知知

26、不如好知，好知不如樂知Date對(duì)象 10-10設(shè)置樣式：無邊框的文本框Onload ( ) 事件，頁面加載就調(diào)用函數(shù)：disptime（顯示時(shí)間）知知不如好知，好知不如樂知數(shù)組 4-1 聲明數(shù)組 var 數(shù)組名數(shù)組名 = = new Array( (數(shù)組大小數(shù)組大小);); 例：例： var emp = = new Array(3) 添加元素 emp0 = “AA; emp1 = “BB; emp2 = “CC;AABBCCemp 也可以聲明數(shù)組并賦初值： 例：例： var emp=new Array(“AA”，“BB”，“CC”)；知知不如好知，好知不如樂知 方案1 ： var objArr

27、 = new Array();/創(chuàng)建一個(gè)空數(shù)組 var objArr = new Array(10);/創(chuàng)建含10個(gè)元素的數(shù)組 var objArr = new Array(“a”,”b”,”c”);/創(chuàng)建數(shù)組并初始化 方案2()： var objArr = “a”,”b”,”c”;/通方案1 組合數(shù)組的創(chuàng)建 var objArr = new Date(),”abc”,1234;/該數(shù)組包含三種數(shù)據(jù)類型，分別是對(duì)象類型,字符串類型和數(shù)字類型數(shù)組 4-1-1知知不如好知，好知不如樂知 如何引用元素：objArrindex的形式來使用數(shù)組中的一個(gè)元素，index是元素在數(shù)組的索引，從0開始計(jì)算 數(shù)

28、組的length屬性：表示數(shù)組的長(zhǎng)度 多維數(shù)組：js本身是沒有多維數(shù)組概念，要通過組合數(shù)組來創(chuàng)建 二維數(shù)組舉例1：創(chuàng)建2*6的二維數(shù)組var arr = new Array(4);for(var i=0;i4;i+)arri= new Array(6); 二維數(shù)組舉例2：3*3var arr = 1,2,3,4,5,6,7,8,9;數(shù)組 4-1-1知知不如好知，好知不如樂知使用數(shù)組var emp = new Array(3);emp0 = Ryan Dias;emp1 = Graham Browne;emp2 = David Greene;document.write(數(shù)組emp中的數(shù)據(jù)為:);document.write(emp0+);document.write(emp1+);document.write(emp2+);數(shù)組 4-2 知知不如好知，好知不如樂知數(shù)組 4