javascript快速入門4--函數與內置對象 · 李炎恢 HTML CSS JavaScript PHP Bootstrap 教程

# javascript快速入門4--函數與內置對象 ## 函數函數(又稱為方法)用于對一大段為了達到某種目的的代碼進行歸類，以使代碼更具有條理： ``` //一段計算三角形面積的代碼 var wide=window.prompt("請輸入三角形的底邊長度！",""); var high=window.prompt("請輸入三角形的高！",""); var area=wide*high/2; if (isNaN(area)) {//判斷用戶是否輸入的是數字 alert("三角形的面積為"+area); } else { alert("您的輸入有誤!"); } ``` 如果我們需要在其它地方使用此功能，那么最簡單的方法就是Ctrl＋C然后Ctrl＋V，使用函數可以節約一些代碼 ``` function calcAngleArea() { //使用function關鍵字聲明一個函數，接著是函數的名稱，函數名稱必須符合變量的命名規范 //花括號用來表示一段代碼塊 var wide=window.prompt("請輸入三角形的底邊長度！",""); var high=window.prompt("請輸入三角形的高！",""); var area=wide*high/2; if (isNaN(area)) { alert("您的輸入有誤!"); } else { alert("三角形的面積為"+area); } } ``` 但是寫了這樣了個計算三角形面積的函數之后，頁面打開時并沒有任何東西會出現，那是因為函數必須使用 “函數名（）”這樣的語句來調用執行，所以我們還需要再添加一句calcAngleArea();如果要多次進行這樣的計算，只需多次調用些函數即可!(事實上，看到這樣的格式，我們發現，像alert(),prompt(),isNaN()這些也是函數，它們是系統內置的函數!) ``` //在之前我們已經聲明了計算三角形面積的函數calcAngleArea calcAngleArea(); calcAngleArea(); calcAngleArea(); //將會進行三次這樣的計算 ``` 當然，我們可以對其進行一些改進，以使這個函數更好用 ``` function calcAngleArea(wide,high) {//具有參數的函數，參數其實是一些變量，多個參數用“，”分隔 var area=wide*high/2; if (isNaN(area)) { alert("您的輸入有誤!"); } else { alert("三角形的面積為"+area); } } ``` 這樣，函數就具有伸縮性了，我們不必強制用戶在prompt彈窗中輸入內容。我們先測試一下函數如何執行 ``` calcAngleArea(12,8);//傳入參數12和8，在函數內部執行。接著我們就看到了輸出 ``` 同樣，有時候我們并不是相讓用戶輸入某些值，也并不想將某些值輸給用戶。但現在這個計算三角形面積的函數不管我們想如何處理結果，它都只是在彈窗中將結果顯示給用戶。這個時候就用到了函數返回值的功能： ``` //在函數內部可以使用return語句將值返回給調用函數的上下文 function calcAngleArea(wide,high) { var area=wide*high/2; if (isNaN(area) || !area) { return false; alert("注意,一個函數中的return執行之后，函數就停止運行了，所以你不會看到我!"); } else { return area; } } var a=calcAngleArea(23,8);//執行函數，函數的返回值將會賦給變量a if (a) { document.write(a);//當函數有返回值時，我們可以以想要的任何方式來輸出a,而不是預先定義好的alert } ``` 這樣，這個函數的功能就是真正的無瑕眥的計算三角形面積的函數了（盡管看上去有些簡單），我們輸入寬和高，然后函數將其計算后將結果返回，如果只是像"calcAngleArea(23,8)"這樣調用函數的話,返回的結果將會丟失，所以我們用一個變量將結果保存了下來。 ## 函數所帶來的作用域問題在函數內部聲明的變量（局部變量），在函數外部并不能訪問 ``` function demo() { var a="外面不能訪問我！"; } //alert(a);//出錯，沒有聲明變量a demo();//執行函數 alert(a);//仍然出錯 ``` 但在函數外部聲明的變量（全局變量），在函數內部是可以訪問的 ``` 　　function demo() { //在一個腳本中，使用function關鍵字聲明的具有名稱的函數在腳本中出現的次序是任意的，并不存在先后之分 alert(globalVar); } //demo();//出錯，執行時變量globalVar還沒有聲明 var globalVar="Hello!"; demo();//輸出Hello! ``` ## 內置對象Math與Date Math對象為我們提供了很多用于數學計算的方法和一些常量 ``` 　　 alert(Math.PI);//輸出π alert(Math.pow(10,3));//輸出10的3次方 alert(Math.abs(-12));//輸出-12的絕對值 var num=23.34; alert(Math.ceil(num));//返回大于等于num的最小整數 alert(Math.floor(num));//返回小于等于num的最大整數。 alert(Math.round(num));//返回與num最接近的整數(四舍五入)。 alert(Math.random());//返回介于 0 和 1 之間的偽隨機數。產生的偽隨機數介于 0 和 1 之間（含 0，不含 1） alert(Math.max(2,3,4));//返回多個數值參數中較大的那個 alert(Math.min(2,3,1));//返回多個數值參數中較小的那個 alert(Math.sqrt(2));//返回一個數的平方根 alert(Math.SQRT2);//返回2的平方根 alert(Math.SQRT1_2);//返回二分之一的平方根 ``` Date對象像一個時光機 ``` var d = new Date();//Date對象需要創建 //Date 對象能夠表示的日期范圍約等于 1970 年 1 月 1 日前后各 285,616 年。 alert(d);//直接輸出這個對象,將會得到一個表示時間的字符串 //這個對象有一些方法,可以用來獲取時間的各個部分 alert(d.getYear());//獲取年,2000年以前返回年份后兩位,2000年之后的返回年份的完整表達方式 alert(d.getFullYear());//始終返回年份的4位數表達方式 alert(d.getMonth());//返回月份,注意,月份是從0開始計數的,所以1月時將返回0 alert(d.getDate());//返回今天幾號 alert(d.getDay());//返回今天星期幾,星期天是0,星期1是1.... alert(d.getHours());//返回小時 alert(d.getMinutes());//返回分鐘 alert(d.getSeconds());//返回秒 alert(d.getMilliSeconds());//返回毫秒 alert(d.getTime()); //返回一個整數值,這個整數代表了從1970年1月1日開始計算到Date對象中的時間之間的毫秒數 //日期的范圍大約是1970年1月1日午夜的前后各285616年,負數代表1970年之前的日期 ``` 我們不但能從中獲取時間值,還可以設置時間值 ``` var d = new Date(); d.setFullYear(1990);//設置年份為1900 alert(d.getFullYear());//返回1900 alert(d.getTime());//輸出的值是負的,這驗證了上面所說的getTime()返回值 ``` 與那些getXXX方法對應的設置時間的函數僅僅是將get改成set ``` var d=new Date(); d.setFullYear(2004); d.setMonth(11);//設置月份為12月,注意月份是從0開始計數的 d.setDate(2); d.setHours(6); d.setMinutes(12); d.setSeconds(12); alert(d.getDay());//輸出2004年12月2日星期幾 //setXXX這樣的方法有個最大的好處就是如果我們設置了錯誤的值,腳本并不會出錯,但日期會自動更正 d= new Date(); d.setYear(2003); d.setMonth(1);//月份從0開始計數 d.setDate(31);//2月從來不會有31號 alert(d);//輸出日期,發現會是3月3號 ``` 運用Date對象這個自動更正的好處,我們可以用它來判斷用戶輸入的日期是否是有效的 ``` //讓用戶輸入生日 var year=window.prompt("請輸入出生年份!","")*1; var month=window.prompt("請輸入出生月份!","")*1; var date = window.prompt("請輸入出生日!","")*1; if (!year || !month || !date) {//NaN轉換成布爾值將會是false alert("您的輸入有誤!"); } else { var timeMachine=new Date(); timeMachine.setFullYear(year); timeMachine.setMonth(month-1);//記住,月份是從0開始計數的 timeMachine.setDate(date); var trueYear = timeMachine.getFullYear(); var trueMonth = timeMachine.getMonth()+1;//記住,月份是從0開始計數的 var trueDate = timeMachine.getDate(); if (trueYear != year || trueMonth != month || trueDate != date) { alert("您撒謊!"); } else { alert("雖然這個時光機能知道輸入的日期是否有效,至于人是不是在那天生的,它是不能去看一看的!"); } } ```