TypeScript ምንድን ነው? ለገንቢ ላልሆኑ ሰዎች በቀላል ቋንቋ

TypeScript ከtypes ጋር የሚመጣ JavaScript ነው። እያንዳንዱ እሴት ምን ዓይነት መረጃ መሆን እንዳለበት መለያ ይጨምራሉ — ቁጥር፣ ጽሑፍ፣ የትዕዛዞች ዝርዝር — እና TypeScript ኮድዎ ከመሠራቱ በፊት አለመጣጣሞችን ይፈትሻል። የTypeScript ድረ-ገጽ "ለtypes syntax ያለው JavaScript" ብሎ ይገልጸዋል፤ ኮዱ ወደ ተራ JavaScript ሲቀየር types ይወገዳሉ፤ ከዚያም JavaScript በሚሠራበት ቦታ ሁሉ ይሠራል።

AI ሲገነቡ ለምን ይጠቅማል

AI ሞዴሎች ኮድን በፍጥነት ይጽፋሉ፤ ፈጣን ኮድ ደግሞ ስህተቶች አሉት፦ በአንድ ፋይል customerName የተባለ መስክ፣ በሌላ ፋይል customer_name፤ ዋጋ እንደ ቁጥር ሳይሆን እንደ ጽሑፍ የተላከ፤ ወይም ተግባር ያልተሟላ እሴት ይዞ የተጠራ። በተራ JavaScript ብዙዎቹ ስህተቶች የሚታዩት አንድ ሰው የተሳሳተ ቁልፍ ሲጫን ብቻ ነው።

TypeScript ብዙዎቹን ቀደም ብሎ ይይዛል፣ ኮዱ እየተጻፈ ሳለ፦

• AI ፈጣን ግብረመልስ ያገኛል። የtype ስህተቶች ትክክል ያልሆነውን መስመር በትክክል ይጠቁማሉ፤ ኤጀንቱ እርስዎ ከማየትዎ በፊት ማስተካከል ይችላል።
• ለውጦች ይበልጥ ደህና ናቸው። መስክ ብትቀይሩ፣ TypeScript አሁንም አሮጌውን ስም የሚጠቀሙ ቦታዎችን ሁሉ ይጠቁማል።
• ኮዱ ራሱን ያብራራል። Types ተግባር ምን እንደሚጠብቅና ምን እንደሚመልስ ይመዘግባሉ፤ ይህም ለእርስዎ፣ ለAI እና በኋላ ላይ ለሚሠራ ማንኛውም ገንቢ ይጠቅማል።
• አርታኢዎች ብልጥ ይሆናሉ። አርታኢው እያንዳንዱ እሴት ምን እንደሆነ ስለሚያውቅ autocomplete እና "go to definition" በደንብ ይሠራሉ።

ብዙ AI መተግበሪያ ገንቢዎች በነባሪ TypeScriptን የሚጠቀሙበት ትልቁ ምክንያት ይህ ነው።

የዕለት ተዕለት ምሳሌ

በተሰየሙ ክፍሎች ያለ የመርከብ መጋዘን አስቡ። እያንዳንዱ ክፍል ምልክት አለው፦ "ፓሌት ብቻ"፣ "ማቀዝቀዣ"፣ "ከ500 ኪ.ግ በላይ የለም"። ዕቃ ሲደርስ፣ በበሩ ላይ ያለ ፈታሽ ዕቃውን ከምልክቱ ጋር ያወዳድራል። ለደረቅ ዕቃ ክፍል የታቀደ የቀዘቀዘ ዓሣ በበሩ ላይ ይቆማል፤ ሳምንት ቆይቶ ሽታ ሲለቅ አይደለም።

TypeScript በሩ ላይ ያለው ፈታሽ ነው። types ምልክቶቹ ናቸው። ፍተሻው የሚከናወነው ዕቃው — ኮድዎ — ስራ ላይ ከመዋሉ በፊት ነው። ሁሉም ቦታ ሲገባ ምልክቶቹ ይወገዳሉ፦ የሚሠራው JavaScript ምንም type አይቀርለትም።

TypeScript እንዴት ይሰራል

1. እርስዎ (ወይም AI) .ts ወይም .tsx ፋይሎችን ይጽፋሉ — TypeScript በtype መለያዎች።
2. የtype ፈታሹ ኮዱን ያነባል እና አለመጣጣሞችን በአርታኢው ወይም በbuild ውስጥ እንደ ስህተቶች ይዘግባል።
3. የbuild ደረጃ types ያስወግዳል፣ ተራ JavaScript ያመነጫል።
4. JavaScriptው በብራውዘር ወይም በሰርቨር (Node.js፣ Deno፣ Bun) ላይ ይሠራል።

አስፈላጊ ውጤት፦ TypeScript የጻፉትን ኮድ ይፈትሻል፤ መተግበሪያው በሚሠራበት ጊዜ የሚመጣውን መረጃ አይፈትሽም። አንድ ውጫዊ API ያልተጠበቀ ነገር ቢልክ፣ የሩጫ ጊዜ validation ካልጨመሩ TypeScript አያየውም።

ምሳሌ፦ የቀጠሮ ቅጽ

ለፀጉር ሳሎን የቀጠሮ መተግበሪያ እየገነቡ ነው እንበል። ቀጠሮን የሚገልጽ type እነሆ፦

type Booking = {
  id: number;
  customerEmail: string;
  service: "haircut" | "colour" | "blow-dry";
  startsAt: Date;
  price: number;
  notes?: string; // the ? means optional
};

እና ቅድመ-ክፍያ የሚያሰላ ተግባር፦

function depositFor(booking: Booking): number {
  return booking.price * 0.2;
}

አሁን TypeScript ምን እንደሚይዝ ይመልከቱ።

በስህተት የተጻፈ መስክ።

depositFor({ id: 1, customerEmail: "lena@example.com", service: "haircut",
  startsAt: new Date(), prise: 40 });

TypeScript prise የሚታወቅ ንብረት እንዳልሆነና price እንደጎደለ ይዘግባል። በተራ JavaScript ይህ በጸጥታ NaN (ቁጥር አይደለም) የሆነ ቅድመ-ክፍያ ያሰላ ነበር።

የተሳሳተ ዓይነት እሴት።

const booking: Booking = { ...otherFields, price: "40" };

TypeScript ጽሑፍ ቁጥር በሚጠበቅበት ቦታ ጥቅም ላይ ሊውል እንደማይችል ይዘግባል። ያለሱ "40" * 0.2 በአጋጣሚ ይሠራል፤ ግን "40" + 5 "405" ይሰጣል — በደረሰኝ ላይ የሚታይ ዓይነት ባግ።

የሌለ አገልግሎት።

const booking: Booking = { ...otherFields, service: "perm" };

TypeScript "perm" ከተፈቀዱ አገልግሎቶች አንዱ እንዳልሆነ ይዘግባል። ሳሎኑ በኋላ perms ሲጨምር፣ ወደ type ያክሉት፤ TypeScript ማዘመን የሚያስፈልጋቸውን ቦታዎች ሁሉ ያሳያል — የዋጋ ዝርዝሩን፣ ቅጹን፣ የቀን መቁጠሪያ ቀለሞችን።

ሊይዘው የማይችለው። የቀጠሮ ቅጹ ከአሳሹ ወደ ሰርቨር price: "40" ቢልክ፣ በሰርቨር ላይ ያለው TypeScript በሩጫ ጊዜ አያየውም። ለዚህ ነው በደንብ የተሠሩ መተግበሪያዎች የሚመጣውን መረጃ ደግሞ የሚያረጋግጡት፤ ብዙውን ጊዜ ቅርጹን ፈትሾ ትክክለኛ Booking የሚያደርግ የvalidation ቤተ-መጻሕፍት በመጠቀም።

TypeScript ከJavaScript ጋር

ማብራሪያ ያላቸው ቃላት

የተለመዱ ስህተቶችና ያልተሳሳቱ ግንዛቤዎች

• "TypeScript ኮዱን ከባግ ነፃ ያደርገዋል።" የመረጃ ቅርጽ አለመጣጣሞችን ይይዛል፤ የተሳሳተ ሎጂክን አይደለም። የ20% ፋንታ 2% ቅድመ-ክፍያ በtype ፍተሻ ያልፋል።
• "Types ከመጥፎ ግብዓት ይጠብቁኛል።" Types በሩጫ ጊዜ ይጠፋሉ። ከተጠቃሚዎች፣ ከቅጾችና ከAPIዎች የሚመጣን መረጃ validate ያድርጉ።
• በየቦታው any። AI ተጣብቆ ሲሆን ስህተቶችን ለማጥፋት any ወይም // @ts-ignore ሊጠቀም ይችላል። ይህ ችግሮችን ከመፍታት ይልቅ ይደብቃቸዋል።
• Preview ስለሚሠራ የtype ስህተቶችን ችላ ማለት። አንዳንድ መሣሪያዎች የtype ስህተት ያለበትን ኮድ አሁንም ያሠራሉ። ስህተቶቹ አሁንም ሊፈጠሩ የሚጠብቁ ባግች ናቸው።
• "TypeScript ቀርፋፋ ነው።" Types ከመሠራቱ በፊት ይወገዳሉ፤ የሚሠራው JavaScript በመሠረቱ ተመሳሳይ ነው።
• "ለትላልቅ ቡድኖች ብቻ ነው።" ብቻቸውን የሚገነቡም ይጠቀማሉ፤ በተለይ AI አብዛኛውን ለውጥ በሚያደርግበት ጊዜ።

ለAI ገንቢዎ ምን እንደሚጠይቁ

• "TypeScriptን በstrict mode ተጠቀም።"
• "ለዋና መዝገቦቻችን — Customer፣ Booking፣ Invoice — የተጋሩ types ግለጽና በሁለቱም frontend እና backend ላይ ተጠቀምባቸው።"
• "ስህተቶችን ለማለፍ any ወይም @ts-ignore አትጠቀም፤ ዋናውን ችግር አስተካክል እና ምን እንደነበረ ንገረኝ።"
• "ገቢ መረጃን ሁሉ በሰርቨሩ ላይ validate አድርግ፤ በtypes ብቻ አትወስን።"
• "የtype ፈታሹን አሂድና ተከናውኗል ከማለትህ በፊት እያንዳንዱን ስህተት አስተካክል።"
• "መስክ ስትቀይር TypeScript የሚጠቁማቸውን ቦታዎች ሁሉ አዘምን።"
• "ይህንን type ስህተት በተራ እንግሊዝኛ አብራራ።"

AI ያመነጨውን ለመፈተሽ የበለጠ ለማወቅ AI ያመነጨ ኮድን እንዴት መገምገም እንደሚቻል እና AI ለተገነባ መተግበሪያ ባግ እንዴት መፈለግ እንደሚቻል ይመልከቱ።

TypeScript በMythex

ምንም የተለየ ነገር ካልጠየቁ፣ Mythex አዳዲስ ፕሮጀክቶችን በVite + React + TypeScript + Tailwind ላይ ይጀምራል። የኮድ አርታኢው የቋንቋ ብልህነት ይዟል — ለTypeScript እና JavaScript (ከሌሎች ቋንቋዎች መካከል) ማጠናቀቂያዎች፣ ምርመራዎችና go-to-definition — ስለዚህ የtype ስህተቶች በኮዱ ውስጥ ይታያሉ፤ በPreview ብቻ አይደለም። አርታኢው በFree ላይ ለማንበብ ብቻ፣ በPro ላይ ሙሉ ለሙሉ ለማረም ይቻላል። በመጀመሪያ ጥያቄዎ የተለየ ማዋቀር ማለት ይችላሉ፤ ቴክኖሎጂው እንዴት እንደሚመረጥ የሰነድ ገጽ ያብራራል፣ የኮድ አርታኢው ሰነድ ደግሞ አርታኢው ምን እንደሚያሳይ ይሸፍናል።

ጥያቄዎች