כיצד להשתמש בקביעות מסוג TypeScript

קביעות סוג ב-TypeScript הן דרך לומר למהדר שאתה יודע יותר על סוג הערך מאשר הוא יודע. זה יכול להיות מועיל כאשר אתה עובד עם ערכים שיש להם סוגים לא ודאיים או רחבים, ואתה רוצה לצמצם אותם לבדיקת סוגים טובה יותר וקריאות קוד. במאמר זה, נחקור כיצד להשתמש ביעילות בקביעות מסוג TypeScript.

מהי הצהרת סוג?

Type assertion הוא מנגנון ב-TypeScript המאפשר לך לעקוף את מסקנת ברירת המחדל של הסוג שנעשתה על ידי מהדר TypeScript. זה לא משנה את סוג זמן הריצה בפועל אבל עוזר למהדר להבין את סוג המשתנה לצורך בדיקת הסוג. קביעות סוגים דומות להטלת טיפוסים בשפות אחרות כמו C# או Java, אך ללא כל השפעה על זמן הריצה.

תחביר של קביעות סוגים

ישנן שתי דרכים להשתמש בקביעות טיפוס ב-TypeScript:

  • שימוש במילת המפתח as (מומלץ)
  • שימוש בסוגריים זווית <>

שימוש במילת המפתח as

הדרך הנפוצה ביותר להשתמש בהצהרות סוג היא עם מילת המפתח as:

let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue as string).length;

console.log(strLength); // Output: 17

בדוגמה זו, אנו אומרים ל-TypeScript ש-someValue הוא מסוג string, מה שמאפשר לנו להשתמש במאפיין length.

שימוש בסוגריים זווית <>

התחביר החלופי עבור קביעות סוג משתמש בסוגריים זווית:

let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue).length;

console.log(strLength); // Output: 17

תחביר זה משיג את אותה תוצאה כמו תחביר as. עם זאת, זה לא מומלץ בסביבות שבהן נעשה שימוש ב-JSX (כגון React), מכיוון שהוא מתנגש עם התחביר של רכיבי JSX.

מקרי שימוש נפוצים עבור הצהרות סוג

קביעות סוגים משמשות בדרך כלל במספר תרחישים:

  • בעבודה עם הסוג לא ידוע
  • בעת טיפול ברכיבי DOM
  • כאשר מצמצמים סוגי איגודים
  • בעת אינטראקציה עם ספריות של צד שלישי חסרות הגדרות סוג

דוגמה: הצהרת טיפוסים עם הסוג לא ידוע

הסוג unknown שימושי כאשר אתה רוצה לקבל כל סוג אבל עדיין צריך לבצע בדיקת סוג לפני השימוש בו. קביעות סוג עוזרות לצמצם את הסוג:

function getLength(value: unknown): number {
  if (typeof value === "string") {
    return (value as string).length;
  } else if (Array.isArray(value)) {
    return (value as any[]).length;
  }
  return 0;
}

console.log(getLength("Hello")); // Output: 5
console.log(getLength([1, 2, 3])); // Output: 3
console.log(getLength(42)); // Output: 0

בדוגמה זו, אנו משתמשים בקביעות סוג כדי לומר ל-TypeScript ש-value הוא string או כל[] מערך.

דוגמה: טיפול ברכיבי DOM

בעת מניפולציה של ה-DOM, TypeScript צריך לדעת את הסוג הספציפי של אלמנט כדי לספק מאפיינים ושיטות מתאימות. קביעות סוג מועילות כאן:

const inputElement = document.getElementById("user-input") as HTMLInputElement;
inputElement.value = "Hello, TypeScript!";

כאן, אנו משתמשים ב-type assertion כדי לומר ל-TypeScript שinputElement הוא HTMLInputElement, מה שמאפשר לנו לגשת ישירות למאפיין value.

הצהרת סוג לעומת ליהוק סוג

זה חיוני להבין את ההבדל בין הצהרת סוג לבין ליהוק סוג. ב-TypeScript, קביעות סוג אינן משנות את הסוג בפועל בזמן הריצה; הם רק אומרים למהדר TypeScript כיצד להתייחס לטיפוס בזמן ההידור. לעומת זאת, יציקת סוגים בשפות אחרות כמו C# או Java עשויה לכלול המרת ערך מסוג אחד לאחר בזמן ריצה, מה שעלול להשפיע על הביצועים וההתנהגות.

אזהרות בעת שימוש בהצהרות סוג

בעוד שהצהרות סוג יכולות להיות חזקות, שימוש לרעה עלול להוביל לשגיאות בזמן ריצה. הנה כמה טיפים לשימוש בטוח:

  • הימנע משימוש בהצהרות כדי להמיר בכוח סוגים לא תואמים.
  • השתמש תמיד בקביעות בזהירות והעדף טיפוסים מצומצמים באמצעות משמרות הטיפוסים של TypeScript.
  • השתמש בקביעות כאשר אתה בטוח לגבי הסוג וכאשר לא ניתן לצמצם אותו אחרת.

דוגמה לקביעת סוג שגוי

הנה דוגמה לטענה מסוג מסוכן:

let someValue: string = "Hello, TypeScript!";
let numValue: number = (someValue as unknown as number); // Dangerous!

console.log(numValue); // Output: Hello, TypeScript! (incorrect)

קוד זה מבצע קומפילציה ללא שגיאות, אך הוא יוביל להתנהגות בלתי צפויה בזמן ריצה מכיוון שהמחרוזת מטופלת באופן שגוי כמספר.

מַסְקָנָה

קביעות סוגים ב-TypeScript מספקות דרך לעקוף את הטיפוסים המתקבלים כאשר אתה יודע יותר על סוג הערך מאשר TypeScript. הם שימושיים בעת התמודדות עם סוגים לא ודאיים, אינטראקציה עם ספריות של צד שלישי או עבודה עם רכיבי DOM. עם זאת, יש להשתמש בהם בזהירות כדי למנוע שגיאות בזמן ריצה ולהבטיח בטיחות סוג בקוד שלך.

על ידי שליטה בקביעות סוג, אתה יכול לכתוב קוד TypeScript אקספרסיבי וחזק יותר. תרגל את השימוש בהם בתרחישים שונים כדי להיות נוחים יותר עם התכונה החזקה הזו.