TypeScript nima va nega kerak

Funksiya songa mo’ljallangan, lekin unga matn berildi. JavaScript bunga e’tiroz bildirmaydi: kod ishlayveradi va noto’g’ri natija qaytaradi. Xato foydalanuvchi ekranida ko’rinadi — siz uni oylar keyin topasiz.

TypeScript shu xatoni kod yozilayotgan paytda aytadi.

Muammoni o’z ko’zingiz bilan ko’ring

Quyidagi JavaScript kodi hech qanday xato bermaydi. Uni ishga tushiring:

JavaScript

Uchta natijaga diqqat bilan qarang:

Chaqiruv Natija Holat
calculateTotal(15000, 3) 45000 To’g’ri
calculateTotal(15000, "3") 45000 Tasodifan to’g’ri
calculateTotal(15000) NaN Buzuq

Ikkinchi qator eng xavflisi. JavaScript "3" matnini o’zi songa aylantirdi va to’g’ri javob berdi. Ya’ni xato bor, lekin u yashiringan. Miqdor "3 dona" bo’lib kelgan kunda natija NaN ga aylanadi.

Ma’lumot turlari darsida JavaScript turlarni qanday o’zi o’girishini ko’rgansiz. Bu qulaylik aynan shu yerda muammoga aylanadi.

TypeScript xuddi shu kodni qanday ko’radi

Endi bir xil funksiyani TypeScript’da yozamiz. Farq faqat ikki joyda — parametr nomidan keyin tip qo’shildi:

function calculateTotal(price: number, quantity: number): number {
  return price * quantity;
}

console.log(calculateTotal(15000, 3));
console.log(calculateTotal(15000, "3"));

tsc bilan tekshirilganda natija shunday bo’ladi:

example.ts(6,35): error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.

Xabarni o’qib chiqing. Unda to’rt narsa bor: qaysi fayl, qaysi qator va ustun, xato raqami va sabab. Eng muhimi — bu xabar kod ishga tushirilmasdan oldin chiqdi.

TypeScript brauzerda ishlamaydi

Muhim jihat: brauzer ham, Node.js ham : number yozuvini tushunmaydi. TypeScript kodi avval oddiy JavaScript’ga aylantiriladi.

Bu ishni tsc bajaradi. Yuqoridagi funksiya kompilyatsiyadan keyin shunday ko’rinishga keladi:

function calculateTotal(price, quantity) {
    return price * quantity;
}
console.log(calculateTotal(15000, 3));

Tiplar butunlay yo’qoldi. Ular faqat yozish va tekshirish paytida yashaydi, tayyor faylda qolmaydi.

Bundan ikkita amaliy xulosa chiqadi:

  1. TypeScript dasturingizni tezlashtirmaydi. Ishlaydigan kod baribir o’sha JavaScript.
  2. Tiplar dastur ishlayotganda tekshirilmaydi. Serverdan noto’g’ri shakldagi JSON kelsa, TypeScript uni to’xtata olmaydi.

Har qanday JavaScript — to’g’ri TypeScript

TypeScript noldan o’rganiladigan yangi til emas. U JavaScript ustiga qo’shimcha qatlam.

Ya’ni bilgan hamma narsangiz o’z kuchida qoladi: funksiya, massiv, obyekt, sikl, map va filter, sinflar — barchasi bir xil yoziladi. Funksiyalar va obyektlar darslaridagi kodni ko’chirib qo’ysangiz, u TypeScript faylida ham ishlaydi.

Siz faqat qo’shimcha yozuv o’rganasiz — qiymat qanday shaklda bo’lishi kerakligini aytadigan yozuv.

Tip yozish har doim ham shart emas

Boshlovchilar ko’p qiladigan taxmin: TypeScript’da har qatorga tip yozish kerak. Aslida unday emas.

// Tip yozilmadi, lekin TypeScript uni string deb biladi
const cityName = "Toshkent";

// Bu esa number
const population = 2900000;

// Bu boolean
const isCapital = true;

TypeScript tipni qiymatdan o’zi aniqlaydi. Bunga tip chiqarish (inference) deyiladi.

Tip asosan bitta joyda yoziladi: funksiya parametrlarida. Sabab mantiqiy — qiymat qayerdan kelishi oldindan noma’lum bo’lgan yagona joy shu.

Nima yutasiz, nima yo’qotasiz

Yutuq Narx
Xato ishga tushirishdan oldin topiladi Qo’shimcha kod yoziladi
Muharrir aniq maslahat beradi Kompilyatsiya qadami qo’shiladi
Funksiyani qanday chaqirish hujjatsiz ko’rinadi O’rganishga vaqt ketadi
Nom o’zgartirish xavfsiz bo’ladi Sozlash fayli boshqariladi

Ikkinchi ustundagi narx bir martalik, birinchi ustundagi foyda esa har kuni takrorlanadi. Loyiha qancha uzoq yashasa, nisbat shuncha foydalikka og’adi.

Qachon TypeScript tanlanadi

Holat Tavsiya
Bir martalik kichik skript JavaScript yetarli
Bir necha oy yashaydigan loyiha TypeScript
Jamoada yozilayotgan kod TypeScript
Boshqalar ishlatadigan kutubxona TypeScript
JavaScript hali yaxshi o’zlashtirilmagan Avval JavaScript

Oxirgi qator eng muhimi. TypeScript JavaScript ustiga quriladi. Poydevor mustahkam bo’lmasa, tip xatolari tushunarsiz tuyuladi.

Amaliy mashq

  1. Yuqoridagi calculateTotal funksiyasini JsRunner’da ishga tushiring va calculateTotal(15000) nega NaN berishini aytib bering;
  2. Shu funksiyaga "3 dona" qiymatini bering va natija qanday o’zgarishini kuzating;
  3. NaN ni boshqa songa qo’shib ko’ring (NaN + 100) — natija nima bo’lishini tekshiring;
  4. Yuqoridagi TypeScript misolidagi xato xabarini o’qib, undagi qator va ustun raqami qaysi belgini ko’rsatayotganini aniqlang;
  5. O’zingiz yozgan JavaScript kodidan bittasini oling va uning qaysi parametrlariga tip yozish foydali bo’lishini belgilang;
  6. Yuqoridagi jadval bo’yicha o’z loyihangiz uchun TypeScript kerakmi yoki yo’qmi degan qarorni bitta jumla bilan asoslang.

2-qadam eng muhimi: u xatoning yashiringan holatdan ko’rinadigan holatga qanday o’tishini ko’rsatadi.

Qisqacha xulosa

  • JavaScript noto’g’ri turdagi qiymatni qabul qiladi va xato chiqarmasdan noto’g’ri natija beradi.
  • TypeScript — JavaScript ustiga tip qo’shadigan til; har qanday ishlaydigan JavaScript kodi TypeScript uchun ham to’g’ri.
  • Tiplar kompilyatsiyada olib tashlanadi — brauzerga oddiy JavaScript boradi.
  • TypeScript dasturni tezlashtirmaydi va ishlash paytida tekshirmaydi.
  • Tipni ko’p holda TypeScript o’zi aniqlaydi; asosiy yoziladigan joy — funksiya parametrlari.
  • Tiplar shaklni tekshiradi, mantiqni emas — testlar baribir kerak.

Keyingi darsda TypeScript o’rnatish va tsc — vositani o’rnatib, birinchi faylni o’zingiz kompilyatsiya qilasiz.

Bu dars foydali bo'ldimi?

marta ko'rildi