iT邦幫忙

2024 iThome 鐵人賽

DAY 20
0
JavaScript

我推的TypeScript 操作大全系列 第 20

我推Day20 - 從零開始:搞懂 TypeScript 運算子的奧義

  • 分享至 

  • xImage
  •  

https://ithelp.ithome.com.tw/upload/images/20241004/20124462F0y1AGKMeR.jpg


一步步引領你掌握運算子的精髓,讓程式邏輯更簡潔流暢!

在 TypeScript 世界裡,運算子(Operators)是功能的基石,讓開發者能夠精準高效地操控資料。

無論是算術運算、單一運算(Unary Operations),還是比較運算,理解這些運算子是撰寫健全且可維護程式碼的基礎。今天,讓我們一起探索 TypeScript 的運算子,揭開它們的奧秘,並釋放它們的潛力吧!💻✨

作為 JavaScript 的超集,TypeScript 不僅包含了類似的運算子與變數概念,還增加了靜態型別的特性。
準備好和我一起深入探討嗎?
那就開始吧!🚀


算術運算子(Arithmetic Operators)

數學運算的核心在於 TypeScript 的算術運算子。
不論是加法(+)、減法(-)、乘法(*)、除法(/)、還是取餘數(%),每個運算子都在數值操作中扮演著至關重要的角色。

透過這些運算子,TypeScript 讓我們能夠優雅地處理數字資料,並確保計算結果的準確性。

範例:


const a = 10;
const b = 20;
console.log(a + b); // 30
console.log(a - b); // -10
console.log(a * b); // 200
console.log(b / a); // 2
console.log(b % a); // 0

再來,TypeScript 進一步加強了這些功能,引入了指數運算子(**),讓我們能夠進行更複雜的數學運算。比如說:

const base = 10;
console.log(base ** 2); // 100

這樣,你就可以輕鬆計算像 10 的平方這樣的天文數字啦!


單一運算子(Unary Operators)

進入單一運算子的領域,我們可以透過 ++ 或 -- 簡單地增減變數的值,讓我們能夠優雅地解決複雜的問題。

範例:

const count = 5;
count++;
console.log(count); // 6

count--;
console.log(count); // 5

再來一個更複雜的範例,逐步拆解:

const num = 10;
const result = ++num - 2; // 11 - 2 = 9
console.log(result); // 9

這樣的運算可以大幅簡化我們在操作數字時的邏輯,特別是在需要精準控制變數值時!


比較運算子(Comparison Operators)

在 TypeScript 世界裡,比較運算子像是守護邏輯之門的哨兵,幫助我們快速判斷條件。從嚴格比較的 === 到大於、小於的運算子,TypeScript 給了開發者處理條件表達式的強大工具。

範例:

const num1 = 18;
const num2 = "18";
console.log(num1 == num2);  // true,因為只比較值
console.log(num1 === num2); // false,因為比較型別和值

常見的比較運算子有:

  • 等於運算子(==):比較兩個值是否相等。
  • 嚴格等於運算子(===):比較兩個值及其型別是否相等。
  • 不等於運算子(!=):比較兩個值是否不相等。
  • 大於運算子(>)小於運算子(<) 等等。

這些運算子能夠快速判斷邏輯條件,並幫助我們編寫簡潔明瞭的程式碼。


總結:掌握 TypeScript 的運算子

今天,我們一起探索了 TypeScript 的基本運算子,從算術運算、單一運算到比較運算,它們都是我們打造高效、精準程式碼的核心工具。擁有這些運算子的深刻理解,開發者們能夠更加靈活地處理邏輯運算,解決複雜的問題。

運算子的力量讓我們不僅能應對當前的挑戰,還能為未來的複雜需求做好準備。
所以,勇敢地運用這些運算子吧,讓我們一起編寫出優雅、穩健的程式碼,迎接未來的挑戰!
Happy coding!🚀


上一篇
我推Day19 - 學會 TypeScript 的 using,讓程式碼優雅無壓力
下一篇
我推Day21 - 解鎖 TypeScript 潛力:7 大實用型別讓你程式碼飛起來!
系列文
我推的TypeScript 操作大全30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言