Window Object Methods

• alert()
• prompt()
• setlnterval()
• clearInterval()
• addEventListener()

Window Object Properties

• An object can be a property of another object

  let Peter = {
    name: "Peter",
    age: 18,
    intro() {
      console.log("Hello, I'm Peter. Eddie is my best friend.")
    },
  }
  
  let student = {
    name: "Eddie",
    age: 19,
    friend: Peter, // Peter is an object, but it is also student's property 
    intro() {
      console.log("Hello, I'm Eddie. Nice to meet you.")
    },
  }
  
  console.log(student.friend);
  student.friend.intro();
  

  ⬆️代碼展示

  

  ⬆️效果展示

• 以下4個皆為 object

  • Console object

  • Document object

  • LocalStorage object

  • SessionStorage object

  • 若要在Storage中儲存ㄑ

    /**
     * JSON.stringify(element) : 將資料作為字串儲存
     * JSON.parse(element)       : 將stringify的element資料變回element的原始type來解讀
     */
    
    let friends = ["Eddie", "Peter", "May"];
    
    localStorage.setItem("myFriends", JSON.stringify(friends));
    let getFriends = localStorage.getItem("myFriends");
    let myfriendsArray = JSON.parse(getFriends);
    
    console.log(myfriendsArray);
    // (3) ['Eddie', 'Peter', 'May'] - will be printed
    

Arrow Function Expression

• 其基本語法為：

  let sayHi2 = (attribute) => {
    // do ..
  }
  

  • 範例

• this keyword

  let student = {
    name: "Eddie",
    // function declaration
    walk() {
      console.log(this);  // student
      console.log(this.name + " is walking.");
    },
    // arrow function expression
    greeting: () => {
      console.log(this);  // window object
      console.log(this.name + " is greeting.");
    },
  }
  
  student.walk();
  student.greeting();
  

  ⬆️代碼展示

  

  ⬆️效果展示

forEach function