Web三大要素:

• 骨頭: HTML
• 衣服: CSS
• 動作: Javascript

JS操作網頁的動作，並產生行為

※常見的JS操控網頁行為函數:

//用來在開發者工具終端機(主控台)印出開發需要的訊息
console.log("你好！");

//用來操控網頁彈出訊息視窗
window.alert("你好！")
//or
alert("你好！");

//用來操控網頁彈出輸入視窗，以輸入需要的訊息給網頁進行下一部應用
prompt("你的名字是?");

Variables變數

• =

  跟數學等號意義不同，將等號右邊的值放入左邊的 variable

• let

  let x = 5;
  x = 6;
  
  console.log(x);
  // 6
  
  let x = 7;
  // error
  

  可想像成一種let箱子，它叫做x，這種let箱子可以被放入值，若又再放入新的值給它，箱子里原本的值會直接被清空，改成放入新的值。若是要重複宣告( variable declaration ) 一個也叫做X的let箱子是不容許的，會回報error。

• const

//const 有常數的意義，

const = 5;
x = 6; //程式跑到這邊就會出現error

當const這種箱子放入值後，就不能再改他了

• var

  現今用法較少，2015-ES6以前的用法，會造成很多問題。因此ES6推出const和let以更精準使用變數宣告

  <aside> 💡 var 可以 redeclaration 也可以 reassignment; 會造成很多變數誤用的問題

  </aside>

  <aside> 💡 let 不行 redeclaration 但可以 reassignment; 現今多用let取代var

  </aside>

  <aside> 💡 const 不行 redeclaration 也不行 reassignment;

  </aside>

前述提及JS可操控網頁行為，例如:

let name = prompt("請輸入姓名:") //輸入 "Andrew Wu" ，prompt() 方法會將此字串存進變數name
console.log(`使用者輸入了姓名:${name}`) //終端機會顯示此訊息給開發者
alert("Hello, " + name + ".") //網頁會跳出視窗給使用者: "Hello, Andrew Wu."