JavaScript第二課(修改)

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

2、 Date 等對象 使用數(shù)組知知不如好知，好知不如樂知案例摘要 for 打印金字塔直線 do while 漂亮的埃及圖像 eval 簡易計(jì)算器 Date 在線時鐘 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 時，知知不

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(每個字符都對應(yīng)一個漂亮的埃及圖像每個字符都對應(yīng)一個漂亮的埃及圖像);do var c = prompt(輸入一個字符，輸入輸入一個字符，輸入N 或或n停止停止,A)

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

5、串表達(dá)式的值 該函數(shù)可以對以字符串形式表示的任意有效的 JavaScript代碼求值。eval() 函數(shù)有一個參數(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) 返回一個 Boolean 值，指明提供的值是否是保留值 NaN （不是數(shù)字）。 如果值是 NaN， 那么 isNaN 函數(shù)返回 true ，否則返回 fal

6、se 知知不如好知，好知不如樂知var str1=prompt(“輸入一個表達(dá)式，我給您計(jì)算,1+1);var result=eval(str1); document.write(str1+=+result);var x = prompt(輸入一些數(shù)據(jù),0);if (isNaN(x) alert (x + 不是一個數(shù)字);else alert (x + 是一個數(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;表示單擊此按鈕時，調(diào)用函數(shù)sum( )執(zhí)行關(guān)鍵字必須唯一，并且大小寫有區(qū)別參數(shù)是可選項(xiàng)，當(dāng)使用多個參數(shù)時，參數(shù)間用逗號隔開知知不如好知，好知不如樂知函數(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)算符號 知知不如好知，好知不如樂知調(diào)用函數(shù) 第一個數(shù) 第二個數(shù) 計(jì)算結(jié)果 知知不如好知，好知不如樂知函數(shù)的參數(shù) 參數(shù)是由函數(shù)的使用

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

10、得到使用該函數(shù)時使用該函數(shù)時輸入的參數(shù)個數(shù)輸入的參數(shù)個數(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)行。 說的簡單點(diǎn)：只要寫了函數(shù)名后面跟了一對小括號，該函只要寫了函數(shù)名后面跟了一對小括號，該函數(shù)就會運(yùn)行。數(shù)就會運(yùn)行。那么傳遞的參數(shù)呢？知知不如好知，好知不如樂知其實(shí)，在函數(shù)中有一個參數(shù)數(shù)組對象（arguments），該對象將傳遞的參數(shù)都封裝在一個數(shù)組中。例：functio

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

12、的變量分為全局變量和局部變量。全局變量是作用在全程序范圍內(nèi)的變量，它聲明在函數(shù)體外；局部變量是定義在函數(shù)體內(nèi)的變量，它僅僅在函數(shù)體內(nèi)起作用。例如， var errorMessage=“”;function checkRequired(v,label) var msg=“請輸入”+label;errorMessage=errorMessage+msg;知知不如好知，好知不如樂知作業(yè)：1. 有五個數(shù)字分別是：5，13，50，17，20。請編寫程序輸出最大值、最小值。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 對象簡介 2-1對象是屬性和/方法的組合 屬性是對象所擁有的一組外觀特征，一般為名詞 方法是對象可以執(zhí)行的功能，一般為動詞 例如：汽車Ferrari對象：汽車屬性：型號：法拉利顏色：綠色方法：前進(jìn)、剎車、倒車知知

14、不如好知，好知不如樂知JavaScript 對象簡介 2-1 內(nèi)置對象內(nèi)置對象 瀏覽器對象 自定義對象 注意：一個對象在被引用之前，必須存在。另外在JavaScript中對于對象屬性和方法的引用，有兩種情況： 該對象為靜態(tài)對象，表示在引用該對象的屬性或方法時不需要為它創(chuàng)建實(shí)例； 在引用該對象屬性和方法時必須為它創(chuàng)建一個實(shí)例，叫做動態(tài)對象。 知知不如好知，好知不如樂知String 對象創(chuàng)建字符串有兩種不同方法 ： 使用 var 語句 var newstr = “這是我的字符串這是我的字符串 創(chuàng)建 String 對象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 對象內(nèi)第一次出現(xiàn)子字符串的字符位置。 substr(start , length ):返回一個從指定位置開始的

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

17、以弧度為單位 min (x, y)返回 x 和 y 兩個數(shù)中較小的數(shù) max (x, y)返回 x 和 y 兩個數(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對象 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ù)，特定精度的四舍五入知知不如好知，好知不如樂知自動刷新 document.write(2秒自動刷新，隨機(jī)顯示圖片); var i=0; i=Math.round(Math.random( )*8+1); document.write(); Math 對象 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 對象10-2 Data 方法的分組： 方法分組方法分組說說 明明 se

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

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

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

22、明 ToGMTString使用格林尼治標(biāo)準(zhǔn)時間 (GMT) 數(shù)據(jù)格式將 Date 對象轉(zhuǎn)換成字符串表示ToLocaleString使用當(dāng)?shù)貢r間格式將 Date 對象轉(zhuǎn)換成字符串表示 To 方法： Parse 方法和 UTC 方法 方方 法法說說 明明Date.parse (date string )用日期字符串表示自 1970 年 1 月 1 日以來的毫秒數(shù) Date.UTC (year, month, day, hours, min., secs. )Date 對象中自 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)在時間:+now.getHours()+點(diǎn)+now.getMinutes( )+分); Date對象 10-7如何實(shí)現(xiàn)獲得當(dāng)前日期和時間獲得小時，即當(dāng)前是幾點(diǎn)判斷上午、下午還是晚上月份數(shù)字011，注意1知知不如好知，好知不如樂知Date 對象10

24、-9JavaScript 代碼function disptime( ) var time = new Date( ); /獲得當(dāng)前時間 var hour = time.getHours( ); /獲得小時、分鐘、秒 var minute = time.getMinutes( ); var second = time.getSeconds( ); var apm=AM; /默認(rèn)顯示上午: AM if (hour12) /按12小時制顯示 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ù)，每隔1秒調(diào)用disptime( )函數(shù)刷新顯示獲得小時、分鐘、秒根據(jù)12小時制調(diào)整時間和AM/PM標(biāo)志確保分鐘和秒顯示位數(shù)為 2 位var myTime = setTimeout(disptime( ),1000);設(shè)置定時器每隔1秒（1000毫秒），調(diào)用函數(shù)disptime( )執(zhí)行，刷新時鐘顯示 知知

26、不如好知，好知不如樂知Date對象 10-10設(shè)置樣式：無邊框的文本框Onload ( ) 事件，頁面加載就調(diào)用函數(shù)：disptime（顯示時間）知知不如好知，好知不如樂知數(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)建一個空數(shù)組 var objArr = new Array(10);/創(chuàng)建含10個元素的數(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ù)類型，分別是對象類型,字符串類型和數(shù)字類型數(shù)組 4-1-1知知不如好知，好知不如樂知 如何引用元素：objArrindex的形式來使用數(shù)組中的一個元素，index是元素在數(shù)組的索引，從0開始計(jì)算 數(shù)

28、組的length屬性：表示數(shù)組的長度 多維數(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