5-2. 加強多了解function與箭頭函數

參考介紹：w3schools(英文版) 或 runoob(簡中版) 或 W3school(簡中版)

  //自定義函數 (可以沒有參數、引數, 也可以沒有return傳回值)
  function 函數名稱(引數){
  被封裝的代碼;
  return  結果;
  }
  //呼叫使用函數
  let 變數名稱 = 函數名稱(參數);
  //呼叫使用函數時小括號內帶入參數, 自定義函數小括號中的引數負責接收參數
  //let定義的變數負責接收 function 傳回的值
  

小範例：沒有傳回值

  //定義函數 ---- 函數名稱(引數){ 要執行的程序; }
  function getSum(a, b){
    console.log(a+b);
  }
  //呼叫調用函數 ---- 函數名稱(參數);
  getSum(10, 20);
  

小範例：有傳回值

  //定義函數 ---- 函數名稱(引數){ 要執行的程序; }
  function getSum(a, b){
  return  a+b;
  }
  //呼叫調用函數 ---- 函數名稱(參數);
  //定義變數負責接收函數傳回的值
  let result = getSum(10, 20);
  console.log(result);
  

可以測試看看：(1)參數數量 < 引數數量   (2)參數數量 > 引數數量
函數中都有一個arguments, 會保存所有傳遞進Fn的參數

小範例：參數數量不等於引數數量

  function getSum(a, b, c){
    console.log(a, b, c);
  }
  getSum(10,20);
  

  function getSum(){
  let sum = 0;
  for ( let i = 0; i < arguments.length; i++ ){
      let num = arguments[i];
      console.log(num);
      sum += num;
  }
  return sum;
  }
  let result = getSum(10,20,30);
  console.log(result);
  

箭頭函數是ES6新增的一種定義函數的方式, 為了簡化定義函數的代碼。

參考介紹：w3schools(英文版) 或 runoob(簡中版) 或 W3school(簡中版)

  let 函數名稱 = (形參列表/引數) => {
      需要封裝的代碼;
  }

小範例：沒有參數、引數

  let say = () => {
      console.log('Hello');
  }
  say();

小範例：有參數、引數

  let say = (name) => {
    console.log('Hello'+name);
  }
  say('Amy');
  

如果只有一個引數, 則(引數)的 () 可以省略，如果 {} 中只有一句代碼, 則 {} 可以省略

小範例：參數數量不等於引數數量

  let say = name => console.log('Hello'+name);
  say('Amy');