鐵人賽 Day 13

再次探討 function 函式

在 JS 裡面函式是第一種物件，基本上能對物件做的事情也都可以對函式做。

1.把函式當作參數帶入另一個函式裡面

const functionB = function() {console.log('FunctionB')}
const functionA = function (functionB){
    return functionB;
}

// 帶入匿名函式當參數也可以

const functionC = functionD(function(){ console.log('Hello')})

2.函式是物件的一種當然也可以有屬性

const rainbow = function() {};
    rainbow.color = 'green';
    
    console.log(rainbow.color) //'green'

箭頭表達式

() =>{} //小括號裡面是代入參數，大括號一樣是寫入要執行的程式碼 

箭頭表達式有兩種特性，一種是更加簡短的語法另一種是 this 的強制綁定
不只是不用打 「function」的簡短方式，如果函式只是回傳運算結果可以省略大括號和 return。

const minus = function(num1,num2){
    return num1-num2;
}
// 箭頭表達式簡單寫法
const minus = (num1, num2) => num1-num2 ;

函式的參數

arguments 物件

在宣告函式的時候常見的做法會把參數的數量指定給函示，呼叫參數時如果帶進去的參數數量和宣告時不符會發生什麼事？

不管是多了參數還是少傳了參數，結果是那些參數會被當作 undefined，多了的那些參數可在 argumnets 物件裡面找得到，arguments 物件具備了指引的特性，但不是陣列！！！

const minus = function(num1, num2) {
  console.log(arguments.length);
  return num1-num2;
};

minus(1,2,3,4);

有了 arguments 物件就可以採用比較有彈性不指定參數數量的做法。

const minus = function() {
 let num = 0
 for(var i = 0; i < arguments.length; i++){
     num -= arguments[i];
    
 }
 return num;
};

minus(1,2,3,4,5) // -15

注意! 在箭頭函示裡沒有 arguments 物件

其餘參數 (rest paramters)

沒有 arguments 物件也還有「其餘參數」可以做到類似的事情，將帶入多的參數以 ... 為開頭命名即是其餘參數，其餘參數是陣列。

const minus = (...args) => {
    let num = 0
    for(var i = 0; i < args.length; i++){
        num -= args[i];
    }
    return num;
}
minus(10,9,8); //-27

參數檢查

前面有提及不對等傳遞參數的多傳參數的情況，那麼少傳參數的情況又是如何？
在上述的這個減法範例數字與 udefined 做運算只會得到 NaN

const minus = (num1, num2) => num1-num2 ;
minus(1); // NaN

為了避免發生這種情況可以加入 OR 運算子

const minus = function(num1, num2) {
    num1 = num1 || 0;  
    num2 = num2 || 0;
    return num1-num2;
}
minus(2); //2