javascript快速入門4--函式與內建物件

水之原發表於2013-12-01
JavaScript函式物件

函式

函式(又稱為方法)用於對一大段為了達到某種目的的程式碼進行歸類，以使程式碼更具有條理：

        //一段計算三角形面積的程式碼
    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("雖然這個時光機能知道輸入的日期是否有效,至於人是不是在那天生的,它是不能去看一看的!");
        }
    }

 

相關文章