Interface — asoslar, sintaksis, ob'ekt shakli

~15 daq · TypeScript · Interface

Foydalanuvchi ob'ekti bir necha joyda ishlatiladi:

function salomlash(user: { ism: string; yosh: number; email: string }) { ... }
function saqlash(user:   { ism: string; yosh: number; email: string }) { ... }
function yangilash(user: { ism: string; yosh: number; email: string }) { ... }

Bir xil tuzilma uch joyda takrorlanmoqda. email ga ? qo'shish kerak bo'lsa — uchala joyni o'zgartirish kerak. Interface bu muammoni hal qiladi: tuzilmaga bir marta nom berib, istalgan joyda ishlatiladi.

Interface nima?

Ob'ektning shakli — qanday xususiyatlar bo'lishi kerak. Bir marta e'lon qilinadi, istalgancha joyda ishlatiladi.

interface Foydalanuvchi {
  ism:   string;
  yosh:  number;
  email: string;
}

Endi uchta funksiya ham shu nomdan:

function salomlash(user: Foydalanuvchi): string {
  return `Salom, ${user.ism}!`;
}

function saqlash(user: Foydalanuvchi): void { ... }
function yangilash(user: Foydalanuvchi): void { ... }

email o'zgarsa — faqat Foydalanuvchi interface o'zgaradi.

Ob'ekt interfacega mos kelishi

Interface ob'ektning majburiy shakli — barcha xususiyatlar bo'lishi shart:

const user: Foydalanuvchi = {
  ism:   "Jasur",
  yosh:  25,
  email: "jasur@mail.com",
}; // ✅

const user: Foydalanuvchi = {
  ism:  "Jasur",
  yosh: 25,
  // ❌ email yetishmayapti
};

Muharrirda user. yozganda TypeScript avtomatik taklif qiladi:

user.
     ├── ism   : string
     ├── yosh  : number
     └── email : string

Metod e'lon qilish

Interface ichida metodlar ham belgilanishi mumkin:

interface Hisoblash {
  qoshish(a: number, b: number): number;
  ayirish(a: number, b: number): number;
}

const kalkulyator: Hisoblash = {
  qoshish(a, b) { return a + b; },
  ayirish(a, b) { return a - b; },
};

TypeScript kalkulyator ning ikkala metodi ham mavjudligini va to'g'ri turlarini tekshiradi.

Class implements

Interface classlar uchun shartnoma vazifasini bajaradi:

interface Hayvon {
  ism:    string;
  ovoz(): string;
}

class It implements Hayvon {
  ism = "Baxter";
  ovoz() { return "Vov!"; }
}

class Mushuk implements Hayvon {
  ism = "Miti";
  ovoz() { return "Miyov!"; }
}

implements — "bu class interface ning barcha talablarini bajaradi" kafolat. Biror metod yetishmasa — TypeScript darhol ko'rsatadi.

Tez-tez uchraydigan xatolar

Qo'shimcha xususiyat bilan to'g'ridan tayinlash:

interface Foydalanuvchi { ism: string; yosh: number; }

const user: Foydalanuvchi = {
  ism:  "Jasur",
  yosh: 25,
  bio:  "Developer", // ❌ — 'bio' bu interfaceda yo'q
};

Yechim: interfacega bio? qo'shing yoki alohida o'zgaruvchi orqali bering:

const malumot = { ism: "Jasur", yosh: 25, bio: "Developer" };
const user: Foydalanuvchi = malumot; // ✅ — structural typing ishlaydi

Interface ni runtime da ishlatish:

if (x instanceof Foydalanuvchi) { } // ❌ — interface runtime da yo'q

Interface faqat kompilyatsiya vaqtida mavjud. instanceof faqat class bilan ishlaydi.

Xulosa

interface Foydalanuvchi {
  ism:   string;  // majburiy
  yosh:  number;  // majburiy
  email: string;  // majburiy
}

const user: Foydalanuvchi = { ... }       // o'zgaruvchi
function fn(u: Foydalanuvchi) { ... }     // parametr
class X implements Foydalanuvchi { ... }  // class shartnomasi

Interface — ob'ektning shakli. Bir marta e'lon, istalgancha ishlatish. Bir joyda o'zgarish — hamma joyda yangilanadi.

Keyingi dars

17-dars: Optional (?), readonly, Index signature