In diesem Artikel zeige ich Ihnen, wie ich meine Fähigkeiten in TypeScript verbessert habe. Ich stelle Ihnen 5 zufriedenstellende Operatoren vor, die Ihnen helfen, TypeScript und seine Verwendung besser zu verstehen. Hier sind die Operatoren, die ich behandeln werde:
Nicht-Null-Assertionsoperator
Optionaler Verkettungsoperator
Null-Koaleszenzoperator
Explizite Typ-Assertion
Explizite Typkonvertierung
Der Nicht-Null-Behauptungsoperator ist ein nachgestelltes Ausrufezeichen (!
), das TypeScript mitteilt, dass der Wert des Ausdrucks nicht null sein wird. code> oder <code>undefiniert
. Dadurch werden Typfehler aufgrund möglicher null
- oder undefinierter
-Werte vermieden. [Empfohlenes Lernen: Javascript-Video-Tutorial!
),它告诉 TypeScript,表达式的值不会是 null
或 undefined
。这可以避免因为可能的 null
或 undefined
值而导致的类型错误。【推荐学习:javascript视频教程】
示例:
const element: HTMLElement | null = document.getElementById("my-element"); const width: number = element!.offsetWidth;
在这里,element
可能为 null
,但是我们使用非空断言操作符告诉 TypeScript 我们知道 element 的值不是 null
,所以不会出现类型错误。
可选链操作符(?.
)允许您在访问对象属性时不必担心属性是否存在。如果属性不存在,则返回 undefined
。
示例:
interface Person { name: string; address?: { city: string; }; } const person: Person = { name: "John", }; const city = person.address?.city;
在这里,address
属性是可选的,所以我们使用可选链操作符来安全地访问 city
属性,而不会抛出错误。
空合并操作符(??
)是一种简洁的方式来提供默认值,当一个表达式的值为 null
或 undefined
时使用。
示例:
const value: number | null = null; const defaultValue = 42; const result = value ?? defaultValue;
在这里,当 value
为 null
时,result
的值将是 defaultValue
。
有时,您可能希望将一个类型明确地断言为另一个类型。您可以使用 <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
。
在某些情况下,您可能希望将一个值从一种类型转换为另一种类型。要执行此操作,您可以使用类型的构造函数。
示例:
const value: string = "42"; const numberValue: number = Number(value);
在这里,我们将 string
类型的 value
转换为 number
类型的 numberValue
]
Beispiel:
rrreeeHier könnteBeispiel: 🎜rrreee🎜Hier ist das Attributelement
null
sein, aber wir verwenden den Nicht-Null-Behauptungsoperator, um TypeScript mitzuteilen, dass wir wissen, dass der Wert von element nichtnull ist. code>, sodass keine Typfehler auftreten. <p></p> <h2 data-id="heading-1">2. Optionaler Verkettungsoperator</h2>
address
optional, daher verwenden wir den optionalen Verkettungsoperator, um sicher auf das Attribut city
zuzugreifen, ohne einen Fehler auszulösen. 🎜??
) ist eine prägnante Möglichkeit, einen Standardwert bereitzustellen, wenn er verwendet wird Der Wert eines Ausdrucks ist null
oder undefiniert
. 🎜🎜Beispiel: 🎜rrreee🎜Wenn hier value
null
ist, ist der Wert von result
defaultValue
. 🎜<Type>
oder der Syntax as Type
tun. 🎜🎜Beispiel: 🎜rrreee🎜oder: 🎜rrreee🎜Hier behaupten wir den input
vom Typ unknown
an string
und dann seine Länge. Die Behauptung ist Nummer
. 🎜value
vom Typ string
in numberValue
vom Typ number
. 🎜🎜Das Verständnis dieser Operatoren wird Ihnen helfen, TypeScript besser zu verstehen und Ihre Fähigkeiten zu verbessern. Ich hoffe, dass Sie diese Operatoren nutzen werden, um Ihre TypeScript-Programmierung zu verbessern! 🎜🎜🎜Originallink: https://dev.to/codeoz/how-i-improve-my-skills-in-typescript-5-satisfies-operator-2312🎜🎜🎜Weitere programmierbezogene Kenntnisse finden Sie unter: 🎜 Programmierunterricht🎜! ! 🎜Das obige ist der detaillierte Inhalt von5 praktische TypeScript-Operatoren, die Ihnen helfen, Ihre Entwicklungsfähigkeiten zu verbessern!. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!