📖
JavaScript - 網站程式設計
  • JavaScript - 網站程式設計
  • 1. 簡介
    • 1.1 講者簡介
    • 1.2 課程簡介
    • 1.3 開發工具簡介
  • 2. JS 在網頁上的基本觀念
    • 2.1 變數宣告
    • 2.2 資料型態
    • 2.3 基礎節點操控
    • 2.4 套用方式
  • 3. 瀏覽器物件模型 (BOM)
    • 3.1 Window
    • 3.2 Location
    • 3.3 內建彈出視窗
  • 4. 文件物件模型 (DOM)
    • 4.1 DOM 簡介
    • 4.2 取得節點、內容、屬性
    • 4.3 節點查找(Traversing)
    • 4.4 更新節點
    • 4.5 新增節點
    • 4.6 刪除節點、屬性
    • 4.7 操控 class 屬性
    • 4.8 練習
  • 5. 事件 (Events)
    • 5.1 事件(Event)簡介
    • 5.2 事件物件(Event Object)
    • 5.3 window 及 document 事件
    • 5.4 滑鼠相關事件
    • 5.5 鍵盤相關事件
    • 5.6 scroll 事件
    • 5.7 表單事件及停止元素預設行為
    • 5.8 動態事件綁定
    • 5.9 練習
  • 6. 表單 (Form)
    • 6.1 取得表單資料
    • 6.2 設定表單資料
    • 6.3 練習
  • 7. 儲存機制(Storage)
    • 7.1 Cookies
    • 7.2 localStorage
  • 8. ECMAScript (ES)
    • 8.1 Template String
    • 8.2 Arrow Function
    • 8.3 Spread and Rest Operator
    • 8.4 物件屬性簡寫
    • 8.5 解構賦值
  • 9. 作業
  • 10. 參考資料
Powered by GitBook
On this page
  • 變數概念
  • 語法概念
  • 變數命名原則
  • 指派(=)運算子
  • 變數宣告
  • var
  • let
  • const
  1. 2. JS 在網頁上的基本觀念

2.1 變數宣告

Previous2. JS 在網頁上的基本觀念Next2.2 資料型態

Last updated 2 months ago

在 javascript/practice 資料夾下,建立 variable.html 檔案,以便練習。

變數概念

  • 將變數想成是一個箱子,裡面一次只能裝一種東西(資料)。

  • 可以將箱子裡的東西(資料)換成其它的。

  • 東西(資料)可以是文字、數值等等不同的資料類型。

語法概念

  • 變數宣告:先使用 var,以後會再學到 let 與 const。

  • 變數名稱:可自訂,名稱勿使用數字開頭。儘量用英文字當開頭。

  • =:原文是 assign (指派)的意思,指的是將右邊的資料,指派給左邊的變數名稱,這樣的過程,就是賦值。所以並不是數學中的「等於」的意思。

  • 變數資料:可儲存任何的資料給變數名稱,會有不同的資料類型,此處以雙引號括起,代表的是字串的意思。

  • 最後的分號,表示該行程式碼的結束。

變數命名原則

  • 可包含大小寫字母、數字、底線(_)、錢字符號($)。

  • 起始必須是字母或底線或錢字符號。

  • 字母大小寫是不同的。變數 x 和變數 X 是視為不同的變數。

指派(=)運算子

這邊認識到第一個運算子(operator):等號(=),在這裡是「指派(assignment)」運算子的意思。

這裡的等號並不是數學中 "比較" 的意思,如果是想要表達比較的意思,要用 == 或 ===。

變數宣告

var

方式一:宣告之後,直接賦值:

var job = "web developer";

方式二:先宣告,之後再賦值:

var job;
job = "web developer";

var 宣告的變數可視範圍(scope)是函式(Function)。

let

宣告方式與 var 相同。差別在於可視範圍(scope)。

let 宣告的變數可視範圍(scope)是區塊(Block)。

const

常數(Constant),一個變數若宣告成常數,就不能再被改變,而且在宣告的時候,就要直接賦予其值。例:

const my_id = "abc123";

如果寫成以下這樣,會看到錯誤訊息:

const my_id; // 沒有在宣告的時候賦予其值,會出錯。
my_id = "abc123";

錯誤訊息如下:

如果寫成這樣,會看到錯誤訊息:

const my_id = "abc123";
my_id = "abc456"; // 試圖改變常數的值,會出錯。

錯誤訊息如下:

const 宣告的變數可視範圍(scope)是區塊(Block),與 let 相同。

測試看看以下例子將 var 改成 let 和 const 看看:

if(true){
  var a = 1;
}
console.log(a);

圖片出自於:

不能使用到。

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables
保留字