js的函式function(一)

lovelyk發表於2021-01-16
JS函式Function

function函式

function的英文是[功能],[數] 函式；職責；盛大的集會的意思
在js裡，就是函式的意思。在Java裡叫做方法。

定義函式

    function fun(引數){
        //函式體
        //return可有可無，根據實際要求加或不加
    }

使用函式

    //函式名()
    fun();

ps:在js裡，我們的方法可以先呼叫後宣告，也就是呼叫寒素的程式碼可以寫在定義函式的前面。

實參、形參

實參：簡單理解就是實際的引數，在呼叫函式的時候傳的
形參：簡單理解就是在定義函式時，用來接收呼叫時傳的值

    var n1=123 , n2=456
    //呼叫函式
    fun(n1 , n2)

    //定義函式
    function fun( a , b){
        a += 100
        b += 100
        console.log(a , b)
    }
    console.log(n1 , n2)
    
    //執行結果:223 , 556
    //123 , 456

ps：我們可以看出，實參和形參並不是同一個變數

不太嚴謹的引數列表

先看一段程式碼:

    function fun(a , b , c){
        console.log(a*10 , b+10 , c-10)
    }
    //呼叫
    fun(1,2,3)//輸出結果10，12，-7
    //這裡是沒毛病的，正常輸出

    //但是下面這個呼叫呢？？？
    fun(20,2)
    fun()
    fun(12,32,14,5)

ps：上面的寫法，都不會報錯...如果不信可以自己試試。

  1. 我們在定義函式的時候，定義了多少個引數，按道理來說，就應該嚴格按照規範傳參，但是沒辦法，js裡比較‘寬容’，你傳了多少個引數，就接收多少個引數
  2. 如果多傳了就無視你多傳的引數，從第一個','前的引數為第一個引數算
  3. 如果少傳了，沒有傳的那幾個引數，就為undefined。都沒傳那就值都為undefined

return關鍵字

首先，在js裡，並沒有規定函式在定義的時候，一定要有返回值或者返回值型別這一說法，很活躍的，你想返回什麼結果都可以
其次，如果要返回結果或者結束函式體，就要用到return關鍵字

  1. return用於返回函式的值給呼叫者
  2. return一旦執行，則立馬結束當前的函式，注意：必須時返回具體的值才會結束(可以思考一下遞迴呼叫)
  3. return函式中可以有多個，返回不同條件下的值。比如在switch中，每個case後面可以用return返回具體的值

arguments

在es5裡，arguments是一個物件，用來接收所有的引數，用法和陣列一致；不過目前已被廢棄，有更好的代替它
es6：(推薦使用)

    function fun( n1, n2, ...args ){
        //args只能接收n2後面的數
        //用...接收的就是一個陣列，可以遍歷
    }

ps：...後面不一定要寫args，可以自己隨便命名，符合字串規範就行。一般用args表示

關於...args的用法

  1. args不能放在引數列表的前面
  2. args有且只有一個

關於函式的耦合問題

先看程式碼：

    var num = 100
    var res = fun(1)
    //定義函式
    function fun(n){
        console.log( num + n )
    }
    //輸出為101

ps：上面的程式碼執行結果沒問題，但是，耦合度很高，因為在函式體內，用全域性變數運算，這就很忌諱，如果專案要移植，這些用到的變數就會拖泥帶水的，耦合度高。這在以後的工作中這麼幹容易被炒魷魚...
注意：如果要使用，傳引數就好了，千萬別使用全域性變數

函式名的問題

    var f = function fun(){
        console.log("my name is rainbow")
    }  
    console.log(f)

ps:我們把一個函式體，賦值給了一個變數，那麼這個變數列印出來會怎麼樣呢？
結果:並不會報錯，而是直接列印出了整個函式體的內容。我們可以這麼想，呼叫函式的時候，我們寫的是fun()，也就是 函式名() 就變成了呼叫了。其實，js裡面還真是這麼幹的，函式名加括號就是呼叫了一次函式。
在這裡，大家和我想一個問題，這個方法體賦值給了變數，那這個變數是什麼型別呢？？？

匿名函式

簡單理解就是，你要使用一個函式，但是這個函式沒有名字，這要怎麼使用呢。
很簡單，上面不是說了嗎？

  • 呼叫函式就是 函式名()
  • 而又因為 函式名 = 方法體
  • 那麼 方法體() = 函式名()
    這樣就呼叫了一次函式
    var a = 10;
    var b = 20;****************
    var f = function(){
        console.log(n1+n2)
    };
    f(a,b)//輸出結果30

自執行函式

  • 自執行函式就是自己定義自己執行
    這個就是匿名函式的應用
    (function(){
        console.log('this is rainbow !')
    })();
    例子
    var a = 10;
    var b = 20;
    (function( n1 , n2 ) {
        console.log( n2 + n1)
    })(a ,b);
    //輸出結果為30

ps:

  • 自執行函式的函式體必須要用()包起來。建議最後加上分號';'
  • 自執行應用場景一般在一些類庫上

相關文章