5個實用TypeScript操作符，助你提升開發能力！

在這篇文章中，我將向您展示我如何在 TypeScript 中提高自己的技能。我會向您介紹 5 個令人滿意的操作符，這將幫助您更好地理解 TypeScript 和如何使用它。以下是我將要介紹的操作符：

非空斷言操作符
可選鏈操作符
空合併操作符
明確型別斷言
明確型別轉換

1. 非空斷言操作符

非空斷言操作符是一個後置感嘆號（!），它告訴 TypeScript，表示式的值不會是 null 或 undefined。這可以避免因為可能的 null 或 undefined 值而導致的型別錯誤。【推薦學習：】

範例：

const element: HTMLElement | null = document.getElementById("my-element");
const width: number = element!.offsetWidth;
登入後複製

在這裡，element 可能為 null，但是我們使用非空斷言操作符告訴 TypeScript 我們知道 element 的值不是 null，所以不會出現型別錯誤。

2. 可選鏈操作符

可選鏈操作符（?.）允許您在存取物件屬性時不必擔心屬性是否存在。如果屬性不存在，則返回 undefined。

範例：

interface Person {
  name: string;
  address?: {
    city: string;
  };
}

const person: Person = {
  name: "John",
};

const city = person.address?.city;
登入後複製

在這裡，address 屬性是可選的，所以我們使用可選鏈操作符來安全地存取 city 屬性，而不會丟擲錯誤。

3. 空合併操作符

空合併操作符（??）是一種簡潔的方式來提供預設值，當一個表示式的值為 null 或 undefined 時使用。

範例：

const value: number | null = null;
const defaultValue = 42;

const result = value ?? defaultValue;
登入後複製

在這裡，當 value 為 null 時，result 的值將是 defaultValue。

4. 明確型別斷言

有時，您可能希望將一個型別明確地斷言為另一個型別。您可以使用 <Type> 語法或 as Type 語法來實現這一點。

範例：

const input: unknown = "42";
const value: number = <number>(<string>input).length;
登入後複製

或者：

const input: unknown = "42";
const value: number = (input as string).length;
登入後複製

在這裡，我們將 unknown 型別的 input 斷言為 string，然後將其長度斷言為 number。

5. 明確型別轉換

在某些情況下，您可能希望將一個值從一種型別轉換為另一種型別。要執行此操作，您可以使用型別的建構函式。

範例：

const value: string = "42";
const numberValue: number = Number(value);
登入後複製

在這裡，我們將 string 型別的 value 轉換為 number 型別的 numberValue。

瞭解這些操作符將幫助您更好地理解 TypeScript，並提高您的技能。希望您能善加利用這些操作符來提高您的 TypeScript 程式設計水平！

原文連結：https://dev.to/codeoz/how-i-improve-my-skills-in-typescript-5-satisfies-operator-2312

更多程式設計相關知識，請存取：！！

以上就是5個實用TypeScript操作符，助你提升開發能力！的詳細內容，更多請關注TW511.COM其它相關文章！