比Function Express更好的寫法：Arrow Function Expression

arrow function expression是function expresssion的簡化語法。

JS的函式是first-class object，意思是

• function可以分配給變數，例如let hello = function(){…};

  let hello = () => {
    console.log("Hello world");
  };
  
  hello();
  

• function可以當作argument傳給其他function

  window.addEventListener("click", () => {
    console.log("You click!");
  });
  

Arrow Function Expression的特點

• 沒有this關鍵字綁定，不應該用作objects的methods

  //不能這樣寫，this在arrow function裡是empty object
  let Kai = {
    name: "Kai",
    walk: () => {
      console.log(this.name + "is walking");
    },
  };
  
  Kai.walk();
  

• 如果參數只有0~1個，可以沒有加()，但是如果有多個參數，則一定要加

• 如果不加大刮號而且只有一行程式，會自動return

  let add = (a, b) => a + b;
  console.log(add(10, 6));
  

forEach

為每個陣列元素執行一次提供函數

let luckyNumbers = [1, 2, 3, 4, 5];

luckyNumbers.forEach((n, index) => {
  console.log(n + 3);
  console.log(index);
});

NodeList可以使用forEach，但是在HTMLCollection不行

//HTMLCollection
let helloss = document.getElementsByClassName("hello");
helloss.forEach((element) => {
  console.log(hello);
});

Element Objects