מה זה TypeScript? JavaScript שהוקלד חזק

מה זה TypeScript? מוגדר TypeScript

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

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

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

TypeScript לעומת JavaScript 

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

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

עם זאת, אין פונקציונליות שתוכל לקודד ב- TypeScript שאתה לא יכול גם לקודד ב- JavaScript. הסיבה לכך היא ש- TypeScript אינו מורכב במובן המקובל - הדרך, למשל, C ++ מורכבת לכדי הפעלה בינארית שיכולה לפעול בחומרה שצוינה. במקום זאת, מהדר TypeScript מקודד קוד TypeScript לכדי JavaScript שווה ערך מבחינה פונקציונלית. במאמר זה של שון מקסוול ב- GitConnected יש כמה דוגמאות נהדרות של קטעי קוד TypeScript המכוונים לאובייקטים ומקבלי JavaScript שלהם. לאחר מכן ניתן להריץ את ה- JavaScript המתקבל בכל מקום בו כל קוד JavaScript יכול להריץ, מדפדפן אינטרנט לשרת המצויד ב- Node.js.

אז אם TypeScript הוא בסופו של דבר רק דרך מפוארת לייצר קוד JavaScript, למה להתעסק בזה? כדי לענות על שאלה זו, עלינו לבדוק מאיפה הגיע TypeScript ולמה הוא משמש.

למה משמש TypeScript?

TypeScript שוחרר כמקור פתוח בשנת 2012 לאחר פיתוחו בתוך מיקרוסופט. (ענקית התוכנה נותרה הדיילת והמפתחת הראשית של הפרויקט.) מאמר זה ב- ZDNet מאותה תקופה מציע מבט מסקרן למה זה קרה: “מתברר שאחד המניעים הגדולים היה הניסיון של צוותים אחרים במיקרוסופט שניסו לפתח ולשמור על מוצרי מיקרוסופט ב- JavaScript. "

באותה תקופה, מיקרוסופט ניסתה להגדיל את Bing Maps כמתחרה ל- Google Maps, כמו גם להציע גרסאות אינטרנט של חבילת Office שלה - ו- JavaScript הייתה שפת הפיתוח העיקרית למשימות. אך המפתחים, למעשה, התקשו לכתוב אפליקציות בסדר גודל הצעות הדגל של מיקרוסופט באמצעות JavaScript. אז הם פיתחו את TypeScript כדי להקל על בניית יישומים ברמת הארגון להפעלה בסביבות JavaScript. זו הרוח שמאחורי התווית של השפה באתר הפרויקט הרשמי של TypeScript: "JavaScript שמתרחש."

מדוע TypeScript טוב יותר לעבודה מסוג זה מאשר JavaScript של וניל? ובכן, אנו יכולים להתווכח לנצח על היתרונות של תכנות מונחה עצמים, אך המציאות היא שמפתחי תוכנה רבים העובדים על פרויקטים גדולים של ארגונים רגילים לכך, וזה עוזר לשימוש חוזר בקוד כפרויקטים בגודל בלון. אתה גם לא צריך להזניח את המידה שבה כלי יכול להגביר את פרודוקטיביות המפתחים. כאמור, מרבית ה- IDE של הארגונים תומכים באוסף מצטבר ברקע, אשר יכול לזהות שגיאות בזמן העבודה. (כל עוד הקוד שלך נכון מבחינה תחבירית, הוא עדיין ישודר, אך ייתכן ש- JavaScript שהתקבל לא יפעל כראוי; חשוב על בדיקת השגיאות כמקבילה לבדיקת איות.) IDEs אלה יכולים גם לעזור לך לשקף את הקוד כשאתה נכנס עמוק לתוך פּרוֹיֶקט.

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

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

התקן את TypeScript

מוכנים להתחיל לשחק עם TypeScript? התקנת השפה היא קלה. אם אתה כבר משתמש ב- Node.js במחשב הפיתוח שלך, אתה יכול להשתמש ב- NPM, מנהל החבילות Node.js, כדי להתקין אותו. המדריך הרשמי ל- TypeScript תוך 5 דקות יוביל אתכם בתהליך.

ניתן להתקין את TypeScript גם כתוסף ל- IDE שבחרת, מה שייתן לך את יתרונות הכלים עליהם דיברנו לעיל וגם ידאג לתהליך הידור TypeScript ל- JavaScript. מכיוון ש- TypeScript פותחה על ידי מיקרוסופט, אין זה מפתיע שיש תוספים באיכות גבוהה עבור Visual Studio ו- Visual Studio Code. אך כפרויקט קוד פתוח, TypeScript הותאם בכל מקום, החל מזהי קוד פתוח כמו Eclipse ועד עורכי טקסט מכובדים כמו Vim. וניתן לדפדף ולהוריד את כל הפרויקט מ- GitHub.

תחביר TypeScript

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

סוגי TypeScript

ברור שהתכונה התחבירית החשובה ביותר ב- TypeScript היא מערכת הסוגים. השפה תומכת במספר סוגים בסיסיים:

  • בוליאני: ערך אמיתי / שקר פשוט.
  • מספר: ב- TypeScript, כמו ב- JavaScript, כל המספרים הם ערכי נקודה צפה - אין מספר שלם נפרד. TypeScript תומך בספרות עשרוניות, הקסדצימליות, בינאריות ואיטליות.
  • מחרוזת: מחרוזת של נתונים טקסטואליים. אתה יכול להשתמש במרכאות בודדות או כפולות כדי להקיף את המחרוזת בעת הגדרת הנתונים. אתה יכול גם להשתמש בתגובות גב ( `) כדי להקיף מחרוזות עם מספר שורות, ותוכל להטמיע ביטויים במחרוזת עם התחביר ${ expr }.
  • מערכים ושוליים: סוגים אלה מאפשרים לך לאחסן ערכים מרובים ברצף מוגדר. במערך, הערכים האינדיבידואליים הם מאותו סוג נתונים, ואילו בכפולת הם יכולים להיות הטרוגניים. forEach()שיטת TypeScript משמשת לקריאה לפונקציה בכל אלמנט במערך.
  • Enum: כמו סוג של אותו שם ב- C #, Enype TypeScript מאפשר לך להקצות שמות הניתנים לקריאה אנושית לרצף של ערכים מספריים.
  • כל דבר: זהו סוג עבור משתנה שבו אינך יודע בהכרח לאיזה ערך הוא ייקבע מראש - הוא עשוי לקחת את הערכים שלו מקלט המשתמש או מספריית צד שלישי, למשל.
  • אובייקט: זהו הסוג המייצג כל דבר שאינו טיפוס פרימיטיבי; זה חיוני לאופי המכוון של אובייקטים של TypeScript.

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

let someValue: any;

let strLength: number = (someValue) .length;

והשני הוא asתחביר:

let someValue: any = "זה מחרוזת";

let strLength: number = (someValue as string) .length;

קטעי קוד אלה, שנלקחו מתיעוד TypeScript, שווים פונקציונלית. שניהם מגדירים someValueכמשתנה מסוג anyומקצים כערכו "this is a string", ואז מגדירים strLengthכמספר ומקצים כערכו את אורך התוכן של someValue.

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

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

ממשק TypeScript

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

כללי TypeScript

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

זהות פונקציה (ארג: כל): כל {

    חזרה ארג;

}

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

זהות פונקציה (טיעון: T): T {

    חזרה ארג;

}

קוד זה כולל את משתנה הסוגT , הלוכד את סוג הארגומנט הנכנס ושומר אותו לשימוש מאוחר יותר שלנו.

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

מחלקת TypeScript 

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

תאריך TypeScript

קיימות מספר שיטות ואובייקטים לקבלת וקביעת התאריך והשעה ב- TypeScript, בעיקר בירושה מ- JavaScript. ל- JavaTPoint יש סקירה טובה של האופן שבו זה עובד.

מדריך TypeScript 

מוכנים להעמיק? קבל עדכניות עם מדריכי TypeScript אלה:

  • TypeScript תוך 5 דקות יוביל אותך בתהליך התקנת TypeScript אם עדיין לא עשית זאת.
  • הדרכה זו ב- Visual Studio Code מדגימה כיצד IDEs באמת מוסיפים ליצרנות הפיתוח של TypeScript.
  • מדריך TypeScript למתחילים: המדריך החסר הוא מבוא יסודי באמת שיהיה שימושי גם אם יש לכם חווית JavaScript מוגבלת למדי.

אם אתה מעוניין ללמוד כיצד להשתמש ב- TypeScript עם React, ספריית JavaScript לבניית ממשקי משתמש שפותחו על ידי פייסבוק, עיין כיצד להשתמש ב- TypeScript עם React ו- Redux מ- Ross Bulat ואת הסעיף React ו- webpack בתיעוד TypeScript. למידה שמחה!