null, undefined, void — farqlari va ishlatilishi

~15 daq · TypeScript · Asosiy Turlar

Foydalanuvchi profili API dan keldi. Telefon raqamini formatlash kerak:

const user = await getUser(id);
console.log(user.telefon.trim());
// TypeError: Cannot read properties of null (reading 'trim')

Ba'zi foydalanuvchilarda telefon raqami yo'q — null keladi. JavaScript buni to'xtatmadi, foydalanuvchi xatoni ko'rdi.

null, undefined, void — uchala "qiymat yo'q" ma'nosida tuyuladi. Lekin har biri boshqa holat uchun.

undefined — hali berilmagan

O'zgaruvchi e'lon qilingan, lekin qiymat hali berilmagan. Bu JavaScript o'zi qo'yadi — siz emas.

let ism: string;
console.log(ism); // undefined

Qachon chiqadi:

  • O'zgaruvchi e'lon qilinib, qiymat berilmasa
  • Funksiyaga argument berilmasa
  • Ob'ektda bo'lmagan xususiyatga murojaatda

null — ataylab "yo'q"

Dasturchi o'zi qo'yadi. "Bu joyda qiymat bo'lishi mumkin edi, lekin hozir yo'q" degan ma'no.

type Foydalanuvchi = {
  ism:     string;
  telefon: string | null; // bo'lishi ham, bo'lmasligi ham mumkin
};

const f1 = { ism: "Jasur",  telefon: "+998901234567" };
const f2 = { ism: "Malika", telefon: null }; // telefon yo'q — ataylab

Farqi:

undefined  →  "hali ko'rilmagan" — JavaScript o'zi qo'yadi
null       →  "ko'rildi, ataylab yo'q" — dasturchi qo'yadi

null bilan ishlash

strict: true bilan TypeScript null ni to'g'ridan ishlatishga yo'l qo'ymaydi:

function formatlash(user: Foydalanuvchi): string {
  return user.telefon.trim();
  // ❌ Object is possibly 'null'
}

Tekshirgandan keyin ruxsat:

function formatlash(user: Foydalanuvchi): string {
  if (user.telefon !== null) {
    return user.telefon.trim(); // ✅ — bu blokda aniq string
  }
  return "—";
}

if bloki ichida TypeScript telefon artiq null emasligini biladi — bu type narrowing.

Qisqaroq yozuv — optional chaining:

user.telefon?.trim()      // null bo'lsa → undefined qaytaradi
user.telefon ?? "—"       // null/undefined bo'lsa → "—" qaytaradi
user.telefon?.trim() ?? "—" // ikkalasi birga

void — funksiya hech narsa qaytarmaydi

Funksiya biror ish bajaradi, lekin natija qaytarmaydi:

function xabarBer(matn: string): void {
  console.log(matn); // return yo'q
}

void faqat funksiyaning qaytish turi sifatida ishlaydi. O'zgaruvchiga tayinlash mantiqsiz.

Tez-tez uchraydigan xatolar

null o'rniga undefined ishlatish:

// ❌ — undefined ataylab qo'yilmaydi
type Profil = { avatar: string | undefined };
const p = { avatar: undefined };

// ✅ — "rasm yuklanmagan" deb belgilash
type Profil = { avatar: string | null };
const p = { avatar: null };

void funksiya natijasini ishlatish:

function yuklash(): void {
  fetch("/api/data"); // natija qaytarmaydi
}

const natija = yuklash();
natija.json(); // ❌ — void funksiya undefined qaytaradi

strict o'chirilgan bo'lsa null xatosi ko'rinmaydi:

// strict: false (xavfli)
let ism: string = null; // ✅ — TypeScript ruxsat beradi, lekin xavfli

tsconfig.json da "strict": true yoqish shart — null xatolarini yozilayotganda ko'rsatadi.

Xulosa

          kim qo'yadi     qachon                         qayerda ishlatiladi
────────  ──────────────  ─────────────────────────────  ──────────────────────
undefined  JavaScript      qiymat hali berilmagan         o'zgaruvchi, parametr
null       dasturchi       ataylab "yo'q" deb belgilash   string | null
void       —               funksiya natija qaytarmaydi    funksiya qaytish turi

string | null — null bo'lishi mumkin bo'lgan qiymat. Ishlatishdan oldin tekshirish shart — TypeScript majburiy qiladi.

Keyingi dars

7-dars: any, unknown, never — qachon qaysi, xavflari