整理Javascript函數學習筆記_javascript技巧

來源:互聯網
上載者:User

1、什麼是函數
如果需要多次使用同一段代碼,可以把它們封裝成一個函數。函數(function)就是一組允許在你的代碼裡隨時調用的語句。每個函數實際上是一個短小的指令碼。
如:要完成多組數和的功能。

var sum;sum = 3+2;alear(sum); sum = 7+8;alear(sum);......//不停的重複兩行代碼

如果要實現8組數的和,就需要16行代碼,實現的越多,程式碼也就越多。所以我們可以把完成特定功能的代碼塊放到一個函數裡,直接調用這個函數,就省去重複輸入大量代碼的麻煩。使用函數完成:

function add(a,b){  sum = a+b;//只需要寫一次就可以 }; add2(3,2); add2(7,8); ......//只需要調用函數就可以

2、定義函數
定義函數文法

 function 函數名(參數argument){  函數體statements; } //function定義函數的關鍵字,“函數名”你為函數取的名字,“函數體”替換為完成特定功能的代碼。
function shout(){   var beatles = Array("John","Paul","George","Ringo");   for (var count = 0; count < beatles.length; count++){     alert(beatles[count]);   } } //這個函數裡面的迴圈語句將依次彈出對話方塊來顯示beatles裡面內容。  shout();調用函數,執行指令碼裡的動作

完成對兩個數求和並顯示結果的功能:

<script type="text/javascript">  function add2(){    sum = 3+2;    alert()sum;   }   add2(); </script>

3、函數調用
函數定義好後,是不能自動執行的,需要調用它,直接在需要的位置寫函數名。
第一種情況:在<script>標籤內調用。

<script type="text/javascript">   function add(){     sum = 1+1;     alert(sum);  }   add();//調用函數,直接寫函數名。</script>

第二種情況:在HTML檔案中調用,如通過點擊按鈕後調用定義好的函數。

<html> <head> <script type="text/javascript">   function add2(){     sum = 5 + 6;     alert(sum);   }   </script> </head> <body> <form>  <input type="button" value="click it" onclick="add2()"> //按鈕,onclick點擊事件,直接寫函數名 </form> </body> </html>

4、有參數的函數
其實,定義函數還可以如下格式:
function 函數名(參數1,參數2){
   函數代碼
 }

在定義函數時,你可以為它聲明任意多個參數,只要用逗號把它們分隔開來就行。在函數內部,你可以像使用普通變數那樣使用它的任何一個參數。
按照這個格式,函數實現任意兩個數的和應該寫成:

function add2(x,y){   sum = x + y;   document.write(sum); } //x和y則是函數的兩個參數,調用函數的時候,我們可通過這兩個參數把兩個實際的加數傳遞給函數了。

實現如下功能:
定義函數實現三個數的和,函數名為add3。
計算5、8、3/7、1、4兩組三個數的和。

 <script type="text/JavaScript">   function add3(x,y,z) {   sum = x + y +z;     document.write(x+"、"+y+"、"+z+"和:"+sum+"<br/>");   }   add3(5,8,3);   add3(7,1,4);  </script>

5、傳回值的函數
函數不僅能夠(以參數的形式)接收資料,還能夠返回資料。我們完全可以建立一個函數並讓它返回一個值、一個字串、一個數組或是一個布爾值。這是需要用到return語句。

 function multiply(num1,num2){   var total = num1*num2;   return total; }

之前通過"document.write"把結果輸出來,現在使用函數輸出
我們只要把"document.write(sum)"這行改成如下代碼:

 function add2(x,y){   sum = x + y;   return sum; //返回函數值,return後面的值叫做傳回值。 } //還可以通過變數儲存調用函數的傳回值: result = add2(3,4);//語句執行後,result變數中的值為7。

例:下面這個函數只有一個參數(一個華氏溫度值),它將返回一個數值(同一溫度的攝氏溫度值):

 <script type="text/javascript">   function convertToCelsius (temp) {     var result = temp - 32;     result = result / 1.8;     return result;   }   //函數的真正價值體現在,我們還可以把它們當做一種資料類型來使用,這意味著可以把一個函數的調用結果賦給一個變數:   var temp_fahrenheit = 95;   var temp_celsius = convertToCelsius(temp_fahrenheit);   alert(temp_celsius); </script>

在這個例子裡,變數temp_celsius的值將是35,這個數值由convertToCelsius函數返回。
在命名變數時,我用底線來分隔各個單詞;在命名函數時,我從第二個單詞開始把每個單詞的第一個字母寫成大寫形式(也就是駝峰命名法)。
 1)、變數的範圍
變數既可以是全域的,也可以是局部的。
全域變數(global variable)可以在指令碼中的任何位置被引用。一旦你在某個指令碼裡聲明了一個全域變數,就可以從這個指令碼中的任何位置------包括函數內部------引用它。全域變數的範圍是整個指令碼。
局部變數(local variable)只存在於聲明它的那個函數的內部,在那個函數的外部是無法引用它的。局部變數的範圍僅限於某個特定的函數。
可以用var關鍵字明確地為函數變數設定範圍。
如果在某個函數中使用了var,那個變數就將被視為一個局部變數,它只存在於這個函數的上下文中;反之,如果沒有使用var,那個變數就將被視為一個全域變數,如果指令碼裡已經存在一個與之同名的全域變數,這個函數就會改變那個全域變數值。
例子:

function square(num){   total = num*num;   return total; } var total = 50; var number = square(20);alert(total);

這是錯誤的,number的值為400,但是這裡alert彈出的是total的值,應該是50.

這些代碼將不可避免地導致全域變數total的值發生變化。

全域變數total的值變成了400.我的本意是讓square()函數只把它計算出來的平方值返回給變數number,但因為未把這個函數內部total變數明確地聲明為局部變數,這個函數把名字同樣是total的那個全域變數的值也改變了。

把這個函數寫成如下的樣子才是正確的:

 function square(num){   var total = num*num;   return total; } var total = 50; var number = square(20); alert(total); </script>

正確結果:

以上就是關於Javascript函數的學習筆記,還涉及到了一些變數的知識點,希望對大家的學習有所協助。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.