[ JavaScript 筆記] 變數 Variable & 值 Value 與他們的命名方式

閱讀時間約 3 分鐘
前言:
雖然前面有些定義還沒有完整的解釋,但還是後面再說吧,
誰想一直看理論啊(摔本子)

變數 Variable & 值 Value

變數就像一個寫上標籤的盒子,值就是要放入盒子的東西。
JS 會將變數存在記憶體中,以便未來取用。

宣告變數與賦值

我們告訴 JS 我們需要一個盒子,並且寫上標籤,這個動作就是宣告變數,
盒子裡面放入值,就是賦值(assign):

const a = 15;
// 宣告時,最前面寫 關鍵字,後方接 變數名稱
// 如果有預設值,可以在宣告時直接賦予

這裡用 const 這個關鍵字告訴 JS 我要宣告一個叫做 a 的常數,值是 15,
未來需要使用 a 來做計算時,就可以取用。
反之,如果沒有宣告,它會不知道我們要幹嘛:

a = 15;
// 得到報錯訊息:Uncaught ReferenceError: a is not defined​
// 代表 ​a 沒有被定義

let / const / var 三種常見關鍵字,其中一種最好不要用

上面例子中使用了 const 來宣告,但 JS 還有另外兩種常見關鍵字:let、var。

const - 宣告不可變動之常數
用 const 宣告時,就不能重新賦值 or 重新宣告

const myName = "asdf";
myName = "qwer"; // 重新​賦值時會報錯
const myName = "qwer​"; // 重新宣告也會報錯
// TypeError: Assignment to constant variable

let - 宣告可變動之變數
反之,用 let 宣告時,就能重新賦值,但一樣不能重新宣告

let kingOfThePirates = "MonkeyDLuffy";
kingOfThePirates = "Luffy"; // 重新​賦值沒問題

let kingOfThePirates = "Luffy​"; // 無法重新宣告區塊範圍變數

var - 宣告可變動之變數
跟 let 很像,可以重新賦值,不同的是 var 可以重新宣告
乍看下來很像沒什麼,但如果今天是一個幾萬行的程式碼,
如果用 var 宣告了一個 a 變數,某一天再用 var 宣告一次 a,
這時候程式碼裡的 a 變數就被污染了,
因為不確定這一行取用的 a 到底是哪一次宣告的。

var examRange = "chapter12";
examRange = "chapter13"; // 重新​賦值沒問題
var examRange = "chapter1";; // 重新宣告不會報錯 但是會造成問題

所以 var 最好不要用,不然除錯的時候會很想揍自己。

現在這三個關鍵字先這樣記就好,等到解釋作用域的時候再完整說明一次。

變數名稱與他們的命名方式

變數命名有些習慣要遵守⭐️

  • 不可使用 JS 保留字 JavaScript Reserved Words
  • 不可使用數字開頭
  • 不可使用烤肉串命名法 ex. my-name
  • 使用駝峰命名法 ex. myName
  • 大小寫視為不同變數
  • 特別使用場景下,可使用特殊符號 $ 及 _ 開頭

預告:接下來講資料型態 data type(給自己的備忘)
4會員
12內容數
本來是理科生,在被物理放棄之後成為了文科生,有時理性思考,偶爾卻會脫口出感性的字句;喜歡打字的聲音,以生活為靈感寫下過去、現在與未來。
留言0
查看全部
發表第一個留言支持創作者!
你可能也想看
JavaScript 程式札記 : 日期 Date在網頁開發中,時間與日期的處理是重要且基礎的部分,本文將介紹 JavaScript 中的日期的處理方法,並提供範例程式來協助你理解。
Thumbnail
avatar
梧笙
2024-01-29
JavaScript 陣列學習筆記JavaScript 的陣列學習筆記
Thumbnail
avatar
蕭宇廷
2023-10-18
【筆記】用JavaScript幫你選擇午餐要吃什麼利用JavaScript的Math.random( )函數創造一個隨機值,並透過隨機值的結果印出相對應的文字,就可以讓程式幫你選午餐要吃什麼了
Thumbnail
avatar
冬霞
2023-10-01
JavaScript 程式札記 : ES6 解構賦值解構賦值是 JavaScript ES6 的特性,它讓我們能更簡單地從陣列或物件中提取值,並將這些值賦予到新的變數中。這不僅讓程式碼更簡潔,還提升了可讀性。
Thumbnail
avatar
梧笙
2023-08-19
JavaScript 程式札記 : 宣告變數 let、const 與 var 的區別 let 和 const 是 JavaScript 在 ES6 版本中新的變數宣告方式。使用 let 宣告的變數可以重新賦值,而使用 const 宣告的變數賦值後則不能改變。這兩種新的宣告方式提供了比 var 更嚴格和清晰的變數作用域管理。
Thumbnail
avatar
梧笙
2023-08-16
二周目 Javascript 筆記 邏輯運算 || = or 或 ; true || false ⇒ true p.s 只要左右兩邊有一個true , 那就是true && = and 和 ; true && false ⇒ false p.s 兩邊都要一樣 ! = not ; !true ⇒ false ; 相反 邏輯運算的短路性
avatar
Yu Chun
2023-04-03
新手自學筆記 day4 Javascript 事件處理事件是什麼: 發生了一件事情 執行相對應的程式 常見事件的種類: onclick 「點擊」 onmouseover 「滑鼠移入」 onmouseout 「滑鼠移出」 onmousedown 「滑鼠按住」 onmouseup 「滑鼠放開」 事件處理的三大關鍵: 在哪個事件上發生 事件的種類是什麼 執行
avatar
Yu Chun
2023-03-30
新手自學筆記 day3 Javascript HTML DOMHTML DOM 是什麼? 根據HTML標籤建立的物件結構 每個HTML標籤在Javascript中都有對應的標籤物件 把HTML標籤物件串接在一起, 成為物件結構, 就稱之為HTML DOM HTML DOM (Document Object Model) 操作Document 物件: Docum
avatar
Yu Chun
2023-03-30
新手自學筆記 day2 Javascript Array 陣列陣列是什麼: 按照順序存放其他資料的容器 Javascript 內建的物件 利用有順序的編號,來管理內部的資料 基本語法: 取得陣列長度: 陣列.length 取得陣列中特定編號的資料: 練習題:班上同學有五位,成績分別為 20,35,45,70,100, 請印出班上成績的總平均:
avatar
Yu Chun
2023-03-29
新手自學筆記 Javascript Object 物件基礎基本語法: 物件的函式: 呼叫函式的方法: this 在物件的用法: JSON 寫法:
avatar
Yu Chun
2023-03-29