iT邦幫忙

0

【30 天JavaScript 實戰 】 Day 3|運算子

2025-10-07 04:25:10171 瀏覽
  • 分享至 

  • xImage
  •  

今天是JavaScript學習紀錄的Day3,要讓程式動起來了!

今日的目標:

  • 搞懂運算子
  • 模板字串更方便
  • 相等 vs 嚴格相等
  • 自增與自減
  • 三元運算子

1.什麼是運算子(Operator)

寫程式就像跟電腦對話,但電腦不懂「加減乘除」這些中文
它只懂運算子(Operator)這種「邏輯語言」。

類型 範例 說明
算術運算子 +, -, *, /, % 基本數學運算
指派運算子 =, +=, -=, *= 把右邊的值「指定」給左邊的變數
比較運算子 ==, ===, !=, >, <, >=, <= 比較兩個值是否相等或大小
邏輯運算子 &&, ll, ! 多條件判斷的好幫手
字串運算子 + 可以用 + 串接多個字串
三元運算子 條件 ? A : B 如果條件為真執行 A,否則執行 B

2.模板字串

以前要組字串要用 + 來拼接,但這種寫法一多就會顯得很混亂:

let name = "小明";
let age = 18;
console.log("我是 " + name + ",今年 " + age + " 歲");

但如果用模板字串就非常方便!

let name = "小明";
let age = 18;
console.log(`我是 ${name},今年 ${age} 歲`);

只要用反引號包起來,再用 ${} 插入變數,會讓閱讀性提高許多~
而且!
以前換行要用 \n,現在只要直接按 Enter就可以了!

let poem = `
春眠不覺曉,
處處聞啼鳥。
`;
console.log(poem);

3.相等 vs 嚴格相等

== 和 === 是有差別的,
== 會自動轉型比較,
但 === 不會轉型,型別不同就是不一樣。

console.log(5 == "5");   // true(只比值)
console.log(5 === "5");  // false(值與型別都比)

實務上建議用 ===,可以避免轉型陷阱。
註:轉型陷阱會自動幫你把不同型別的值轉換成相同型別再比較,會有機率造成意外。
像是:

console.log(0 == false);   // true 

"0" 會被轉成數字 0,false 也會被轉成數字 0
結果 0 == 0,就會是true。
但其實左邊是 number,右邊是 boolean(false)。

4.自增與自減

快速讓變數 +1 或 -1 的好幫手

let count = 10;
count++; // 相當於 count = count + 1
count--; // 相當於 count = count - 1

小提醒:++a 是先加再用,a++ 是先用再加。

5.三元運算子

三元運算子可以一句話幫你快速判斷結果,可以取代簡單的if...else判斷式~

let score = 80;
let result = score >= 60 ? "及格" : "不及格"; //其實就是if...else
console.log(result); // 印出 及格

/images/emoticon/emoticon42.gif


圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言