JavaScript funksiya parametrlari: argumentlar va default qiymatlar

Qisqacha: Parametr — funksiya e'lonida qavs ichiga yozilgan nom: function salom(ism). Argument — chaqirishda shu joyga beriladigan haqiqiy qiymat: salom("Ali"). Argument berilmasa, parametr undefined bo'ladi. Buning oldini default qiymat oladi: function salom(ism = "Mehmon").

Bu darsda

• Parametr va argument farqini tushuntira olasiz.
• Bir nechta parametrli funksiya yoza olasiz va argumentlar tartibi nega muhimligini bilasiz.
• Argument kam yoki ortiqcha berilsa, nima bo'lishini oldindan ayta olasiz.
• Parametrga default qiymat bera olasiz va u qachon ishlashini bilasiz.
• Eski kodda uchraydigan argumentsni taniysiz.

Oldin bilishingiz kerak: Funksiya e'lon qilish va chaqirish, undefined va null, ?? operatori, Template literals.

1. Nega bu kerak?

O'tgan darsda yettiningJadvaliniChiqar funksiyasini yozgan edik. U faqat 7 ning jadvalini chiqarardi. 8 ning jadvali kerak bo'lsa-chi? 9 niki-chi?

Har son uchun alohida funksiya yozish — o'sha takrorlash muammosining o'zi:

function yettiningJadvaliniChiqar() { /* ... 7 * i ... */ }
function sakkizningJadvaliniChiqar() { /* ... 8 * i ... */ }
function toqqizningJadvaliniChiqar() { /* ... 9 * i ... */ }

Uchala funksiya deyarli bir xil, faqat bitta son farq qiladi. Bizga bitta jadvalniChiqar funksiyasi kerak. Uni chaqirganda "qaysi sonning jadvali?" deb aytib yuborsak bo'ldi.

Hayotdan o'xshatish: taksi. Haydovchi har safar bir xil ishni qiladi — mashinani haydaydi. Lekin har bir yo'lovchi unga boshqa manzil aytadi: "Chorsuga", "Aeroportga". Manzil haydovchining ishini sozlaydi. Funksiyada bunday ma'lumot parametr orqali beriladi.

2. Parametr va argument

2.1 Birinchi parametrli funksiya

function salomlash(ism) {
  console.log(`Salom, ${ism}!`);
}

salomlash("Ali");
salomlash("Malika");

Konsolda:

Salom, Ali!
Salom, Malika!

Nima o'zgardi? Qavs ichida endi ism so'zi turibdi. Bu — parametr.

Parametr (parameter) — funksiya e'lonida qavs ichiga yoziladigan nom. Funksiya ichida u o'zgaruvchi kabi ishlaydi. Faqat uning qiymatini funksiyani chaqirgan odam beradi.

Argument (argument) — funksiyani chaqirganda qavs ichiga yoziladigan haqiqiy qiymat. Yuqorida "Ali" va "Malika" — argumentlar.

Chaqiruv paytida JavaScript argumentni parametrga joylaydi. salomlash("Ali") chaqirilganda funksiya ichida xuddi let ism = "Ali"; yozilgandek bo'ladi. Keyingi chaqiruvda esa ism endi "Malika"ga teng.

Aslida siz argument berishni allaqachon bilasiz. console.log("Salom") da "Salom" — argument. "-".repeat(20) da 20 — argument. Endi shunday funksiyalarni o'zingiz yozasiz.

2.2 Jadval funksiyasi endi bitta

function jadvalniChiqar(son) {
  console.log(`--- ${son} ning jadvali ---`);
  for (let i = 1; i <= 3; i++) {
    console.log(`${son} x ${i} = ${son * i}`);
  }
}

jadvalniChiqar(7);
jadvalniChiqar(8);

Konsolda:

--- 7 ning jadvali ---
7 x 1 = 7
7 x 2 = 14
7 x 3 = 21
--- 8 ning jadvali ---
8 x 1 = 8
8 x 2 = 16
8 x 3 = 24

Bitta funksiya — istalgan son. son parametri oddiy o'zgaruvchi kabi ishlatildi: template literal ichida ham, arifmetikada ham.

2.3 Argument — istalgan ifoda

Argument sifatida tayyor qiymat, o'zgaruvchi yoki ifoda berish mumkin. JavaScript avval ifodani hisoblaydi, keyin natijani parametrga beradi.

function narxniKorsat(narx) {
  console.log(`Narxi: ${narx} so'm`);
}

const choy = 3000;
narxniKorsat(choy);        // o'zgaruvchi
narxniKorsat(choy * 2);    // ifoda
narxniKorsat(5000 + 1500); // ifoda

Konsolda:

Narxi: 3000 so'm
Narxi: 6000 so'm
Narxi: 6500 so'm

E'tibor bering: o'zgaruvchi nomi (choy) va parametr nomi (narx) bir xil bo'lishi shart emas. Funksiya faqat qiymatni oladi — 3000 sonini. U bu son qaysi o'zgaruvchidan kelganini bilmaydi ham.

Tekshirib ko'ring: narxniKorsat(1000 * 3) chaqirilganda funksiya ichida narx nimaga teng?

3. Bir nechta parametr

3.1 Vergul bilan ajratiladi

Taksi narxi masofaga va tarifga bog'liq. Ikkala ma'lumotni ham funksiyaga beramiz:

function taksiNarxiniChiqar(km, tarif) {
  const narx = km * tarif;
  console.log(`${km} km: ${narx} so'm`);
}

taksiNarxiniChiqar(5, 2000);
taksiNarxiniChiqar(12, 2500);

Konsolda:

5 km: 10000 so'm
12 km: 30000 so'm

Parametrlar ham, argumentlar ham vergul bilan ajratiladi. Parametrlar soni cheklanmagan. Lekin 3 tadan oshsa, kodni o'qish qiyinlashadi.

Funksiya ichida const narx ham e'lon qilindi. U ham, parametrlar ham faqat funksiya ichida mavjud — tashqaridan ularni ko'rib bo'lmaydi. Nega shundayligini scope darsida ko'ramiz — hozircha buni bilish shart emas.

3.2 Tartib muhim

Argumentlar parametrlarga nomiga qarab emas, tartibiga qarab beriladi. Birinchi argument — birinchi parametrga, ikkinchisi — ikkinchisiga.

Choyxonada 4 kishi 120 000 so'm hisobni teng bo'lishmoqchi:

function ulushniHisobla(summa, odamlar) {
  console.log(`Har kishiga: ${summa / odamlar} so'm`);
}

ulushniHisobla(120000, 4);
ulushniHisobla(4, 120000); // ❌ tartib aralashdi

Konsolda:

Har kishiga: 30000 so'm
Har kishiga: 0.000033333333333333335 so'm

Ikkinchi chaqiruvda summa 4 ga, odamlar esa 120 000 ga teng bo'lib qoldi. JavaScript xato bermadi, chunki u sizning niyatingizni bilmaydi. Shuning uchun parametrlarga aniq nom bering va chaqirganda tartibga qarang.

Tekshirib ko'ring: Konsolda nima chiqadi?

js

function farqniChiqar(a, b) {
  console.log(a - b);
}
farqniChiqar(3, 10);

3.3 O'zingiz to'ldiring

Quyidagi funksiya chek qatorini chiqaradi:

function chekQatoriniChiqar(nomi, narx, soni) {
  console.log(`${nomi}: ${soni} x ${narx} = ${narx * soni} so'm`);
}

chekQatoriniChiqar("Somsa", 8000, 3);

Konsolda:

Somsa: 3 x 8000 = 24000 so'm

Bo'sh joylarni to'ldiring. Shu chaqiruvda nomi parametri "Somsa" ga, narx parametri [:8000] ga, soni esa [:3] ga teng. Agar chekQatoriniChiqar("Choy", 3000, 2) deb chaqirsak, jami summa so'm chiqadi.

4. Argument kam yoki ortiqcha bo'lsa

4.1 Kam argument — undefined

Argumentni berishni unutsak nima bo'ladi?

function salomlash(ism) {
  console.log(`Salom, ${ism}!`);
}

salomlash(); // Salom, undefined!

Xato chiqmadi! Argument berilmagan parametrga JavaScript avtomatik undefined qo'yadi. Bu "qiymat hali berilmagan" degani — uni undefined va null darsida ko'rgansiz.

Matnda undefined so'zi chiqishi xunuk, lekin zararsiz. Hisob-kitobda esa yomonroq:

function taksiNarxiniChiqar(km, tarif) {
  console.log(km * tarif);
}

taksiNarxiniChiqar(5); // NaN

5 * undefined natijasi — NaN ("son emas"). Bu NaN keyingi hamma hisoblarga "yuqadi". Oxirida mijozning chekida "NaN so'm" chiqib qoladi.

4.2 Ortiqcha argument — e'tiborsiz qoladi

function salomlash(ism) {
  console.log(`Salom, ${ism}!`);
}

salomlash("Jasur", "Toshkent", 25); // Salom, Jasur!

Parametr bitta — funksiya faqat birinchi argumentni oladi. Qolgan ikkitasi "eshik oldida qoladi". Xato ham, ogohlantirish ham yo'q.

Diqqat: JavaScript argumentlar sonini tekshirmaydi. Java yoki C# kabi tillar bunday holatda xato beradi, JS esa jim turadi. Buni o'zingiz kuzatishingiz kerak. Keyinroq TypeScript bu ishni siz uchun avtomatik bajaradi.

Tekshirib ko'ring: function f(a, b, c) { console.log(a, b, c); } — f(1, 2) chaqirilsa, konsolda nima chiqadi?

5. Default qiymatlar

5.1 = bilan zaxira qiymat

Mehmon ismini aytmasa ham, chiroyli salom chiqsin:

function salomlash(ism = "Mehmon") {
  console.log(`Salom, ${ism}!`);
}

salomlash("Malika");
salomlash();

Konsolda:

Salom, Malika!
Salom, Mehmon!

Default qiymat (default parameter) — argument berilmaganda parametr oladigan zaxira qiymat. Parametr nomidan keyin = va qiymat yoziladi.

Choyxonadagi odatga o'xshaydi. Ofitsiant "Qanaqa choy?" deb so'raydi. Hech narsa demasangiz — ko'k choy olib keladi. Aytsangiz — aytganingizni.

5.2 Default faqat undefined da ishlaydi

Bu nozik joy, keling, sekin ko'ramiz. Default qiymat faqat parametr undefined bo'lganda ishlaydi. null, 0 va bo'sh satr "" ham qiymat hisoblanadi — default ularni almashtirmaydi.

function salomlash(ism = "Mehmon") {
  console.log(`Salom, ${ism}!`);
}

salomlash(undefined);
salomlash(null);
salomlash("");

Konsolda:

Salom, Mehmon!
Salom, null!
Salom, !

Ikkinchi qatorda null so'zi matnga aylanib qo'shildi. Template literal ${ism} o'rniga qiymat nima bo'lsa, o'shani yozadi — null bo'lsa, "null" so'zini. Uchinchi qatorda ism — bo'sh satr. Uning o'rniga hech narsa yozilmadi, shuning uchun vergul va ! orasida faqat bo'sh joy qoldi.

Bu ?? operatoriga o'xshaydi, lekin undan ham tor. ?? nullni ham almashtiradi, default esa faqat undefinedni.

Ikki parametrning ikkalasiga default berish ham mumkin:

function choyBuyurtma(tur = "ko'k", soni = 1) {
  console.log(`${soni} ta ${tur} choy`);
}

choyBuyurtma();
choyBuyurtma("qora");
choyBuyurtma(undefined, 3);

Konsolda:

1 ta ko'k choy
1 ta qora choy
3 ta ko'k choy

Uchinchi chaqiruvda birinchi parametrni "o'tkazib yuborish" uchun ataylab undefined berdik. Bu ishlaydi, lekin chiroyli emas. Shuning uchun odat qiling: default qiymatli parametrlar ro'yxatning oxirida tursin.

5.3 Default chaqiruv paytida hisoblanadi

Default qiymat oddiy son yoki satr bo'lishi shart emas. U istalgan ifoda bo'lishi mumkin. Hatto o'zidan oldingi parametrga ham tayana oladi:

function chegirmaniKorsat(narx, miqdor = narx * 0.1) {
  console.log(`Narx: ${narx}, chegirma: ${miqdor}`);
}

chegirmaniKorsat(50000);
chegirmaniKorsat(200000);
chegirmaniKorsat(200000, 5000);

Konsolda:

Narx: 50000, chegirma: 5000
Narx: 200000, chegirma: 20000
Narx: 200000, chegirma: 5000

Ko'ryapsizmi? narx * 0.1 funksiya e'lon qilingan paytda bir marta hisoblanib qolmaydi. U har chaqiruvda qaytadan hisoblanadi — o'sha chaqiruvdagi narx bilan. Uchinchi chaqiruvda esa argument berilgani uchun default umuman hisoblanmadi.

5.4 Eski usul: || bilan

Default parametrlar JavaScript'ga 2015-yilda (ES6 versiyasida) qo'shilgan. Undan oldin boshqacha yozishardi. Eski kodda buni hali ham uchratasiz:

function mahsulotniYoz(nomi, soni) {
  soni = soni || 1;
  console.log(`${nomi}: ${soni} ta`);
}

mahsulotniYoz("Non");
mahsulotniYoz("Non", 0);

Konsolda:

Non: 1 ta
Non: 1 ta

Ikkinchi chaqiruvda xato bor: 0 ta non so'ralgan edi, lekin 1 ta chiqdi. Chunki 0 — falsy qiymat, || esa har qanday falsy qiymatni almashtiradi. Default parametr bunday xato qilmaydi:

function mahsulotniYoz(nomi, soni = 1) {
  console.log(`${nomi}: ${soni} ta`);
}

mahsulotniYoz("Non", 0); // Non: 0 ta

Yana bir narsaga e'tibor bering: eski misolda soni = soni || 1 deb parametrga yangi qiymat berildi. Parametrni funksiya ichida let o'zgaruvchi kabi o'zgartirish mumkin.

Tekshirib ko'ring: function f(x = 5) { console.log(x); } — f(0), f(null) va f() nima chiqaradi?

6. Parametr — qiymatning nusxasi

Funksiya ichida parametrni o'zgartirsak, tashqaridagi o'zgaruvchi ham o'zgaradimi?

let balans = 50000;

function sarfla(summa) {
  summa = summa - 10000;
  console.log(`Ichkarida: ${summa}`);
}

sarfla(balans);
console.log(`Tashqarida: ${balans}`);

Konsolda:

Ichkarida: 40000
Tashqarida: 50000

O'zgarmadi. Funksiyaga balans o'zgaruvchisining o'zi emas, uning qiymati — 50000 soni berildi. summa shu sonning nusxasini oldi. Nusxani o'zgartirish asl qiymatga tegmaydi.

Xuddi do'stingizga telefon raqamingizni qog'ozga yozib bergandek. U qog'ozdagi raqamni o'chirib tashlasa ham, sizning telefoningiz o'zgarmaydi.

Maslahat: Bu qoida son, satr va boolean uchun aniq ishlaydi. Massiv va obyektlarda holat boshqacha — buni havola semantikasi darsida ko'ramiz.

7. Eski kodda: arguments

Oddiy function ichida arguments degan maxsus narsa avtomatik paydo bo'ladi. Unda chaqiruvda berilgan barcha argumentlar saqlanadi — parametr e'lon qilinmagan bo'lsa ham.

function hisobla() {
  console.log(arguments.length);
  console.log(arguments[0]);
}

hisobla(10, 20, 30);

Konsolda:

3
10

arguments.length — nechta argument berilgani. arguments[0] — birinchi argument. Kvadrat qavs [0] ni satr darsida ko'rgansiz: matn[0] — birinchi harf. Bu yerda ham xuddi shunday, sanash 0 dan boshlanadi.

Buni faqat tanib olish uchun ko'rsatdik — eski kutubxonalarda ko'p uchraydi. Yodlash shart emas. Yangi kodda arguments ishlatmang. U ro'yxatga o'xshaydi, lekin to'liq ro'yxat (massiv) emas. Keyingi darslarda ko'radigan arrow funksiyalarda esa umuman yo'q. Uning zamonaviy o'rnini rest parametrlar (...sonlar) egallagan.

8. Ko'p uchraydigan xatolar

8.1 Satrni qo'shtirnoqsiz berish

function salomlash(ism) {
  console.log(`Salom, ${ism}!`);
}

salomlash(Ali);

ReferenceError: Ali is not defined

Qo'shtirnoqsiz Ali — JavaScript uchun o'zgaruvchi nomi. Bunday o'zgaruvchi yo'q, shuning uchun xato chiqdi. To'g'risi: salomlash("Ali").

8.2 Konsolda undefined yoki NaN

Natijada kutilmaganda undefined yoki NaN ko'rsangiz, birinchi navbatda chaqiruvni tekshiring. Ehtimol, argumentlardan biri unutilgan: taksiNarxiniChiqar(5) o'rniga taksiNarxiniChiqar(5, 2000) bo'lishi kerak edi. Yoki argumentlar tartibi aralashgan.

8.3 Son o'rniga satr berish

function qoshibChiqar(a, b) {
  console.log(a + b);
}

qoshibChiqar(5000, 3000);   // 8000
qoshibChiqar("5000", 3000); // 50003000

JavaScript parametr turini tekshirmaydi. "5000" satr bo'lgani uchun + qo'shish o'rniga matnlarni yopishtirib qo'ydi. Saytdagi forma yoki Telegram botdan kelgan ma'lumot deyarli har doim satr bo'ladi. Uni avval songa aylantiring: qoshibChiqar(Number("5000"), 3000).

8.4 Default keyingi parametrga tayanadi

function chegirmaniKorsat(miqdor = narx * 0.1, narx) {
  console.log(miqdor);
}

chegirmaniKorsat(undefined, 50000);

ReferenceError: Cannot access 'narx' before initialization

Tarjimasi: "narx ga u tayyor bo'lishidan (initialization — boshlang'ich qiymat olishidan) oldin murojaat qilib bo'lmaydi". Parametrlar chapdan o'ngga, navbat bilan to'ldiriladi. miqdor hisoblanayotganda narx hali tayyor emas. Default faqat o'zidan oldingi parametrlardan foydalana oladi. Yechim: tartibni almashtiring — function chegirmaniKorsat(narx, miqdor = narx * 0.1). Bu xatoning ichki sababini TDZ darsida ko'ramiz.

8.5 Bir xil nomli ikki parametr

function taksiNarxiniChiqar(km, km) {
  console.log(km);
}

SyntaxError: Duplicate parameter name not allowed in this context

Ikki parametrga bir xil nom berildi. Eski uslubdagi oddiy skriptlarda bu xato ba'zan chiqmaydi — undan ham yomoni. Unda ikkinchi km birinchisini jimgina bosib ketadi. Har bir parametr nomi takrorlanmas bo'lsin.

9. Mashqlar

1-mashq (oson): Xush kelibsiz

xushKelibsiz funksiyasini yozing. U ikki parametr olsin: ism va shahar. Konsolga Ali, Toshkentdan xush kelibsiz! ko'rinishida chiqarsin. Funksiyani ikki xil argumentlar bilan chaqiring.

function xushKelibsiz(ism, shahar) {
  console.log(`${ism}, ${shahar}dan xush kelibsiz!`);
}

xushKelibsiz("Ali", "Toshkent");
xushKelibsiz("Malika", "Samarqand");

Ali, Toshkentdan xush kelibsiz!
Malika, Samarqanddan xush kelibsiz!

2-mashq (o'rta): Choyxona cheki

chekChiqar funksiyasini yozing. Parametrlari: taom, narx va soni. soni berilmasa, 1 deb hisoblansin. Konsolga Osh x 2 = 70000 so'm ko'rinishida chiqarsin.

Sinab ko'ring: chekChiqar("Osh", 35000, 2) va chekChiqar("Choy", 3000).

function chekChiqar(taom, narx, soni = 1) {
  console.log(`${taom} x ${soni} = ${narx * soni} so'm`);
}

chekChiqar("Osh", 35000, 2);
chekChiqar("Choy", 3000);

Osh x 2 = 70000 so'm
Choy x 1 = 3000 so'm

3-mashq (qiyin): Taksi hisoblagichi

taksiHisobla funksiyasini yozing. Parametrlari: km, tarif (default 2500) va minimal (default 8000).

Qoidalar:

• km berilmagan bo'lsa, konsolga Masofani kiriting deb chiqarsin va boshqa hech narsa qilmasin.
• Narx = km * tarif. Lekin narx minimal dan kam bo'lsa, minimal olinadi.
• Natija: 10 km: 25000 so'm.

Sinab ko'ring: taksiHisobla(), taksiHisobla(2), taksiHisobla(10), taksiHisobla(10, 3000), taksiHisobla(1, undefined, 5000).

function taksiHisobla(km, tarif = 2500, minimal = 8000) {
  if (km === undefined) {
    console.log("Masofani kiriting");
  } else {
    let narx = km * tarif;
    if (narx < minimal) {
      narx = minimal;
    }
    console.log(`${km} km: ${narx} so'm`);
  }
}

taksiHisobla();
taksiHisobla(2);
taksiHisobla(10);
taksiHisobla(10, 3000);
taksiHisobla(1, undefined, 5000);

Masofani kiriting
2 km: 8000 so'm
10 km: 25000 so'm
10 km: 30000 so'm
1 km: 5000 so'm

10. Real ishda

Parametrlar — funksiyani "sozlanadigan" qiladigan narsa. Real loyihalarda deyarli har bir funksiya parametr oladi:

• Telegram bot: xabarYubor(chatId, matn) — kimga va nima yuborish.
• To'lov tizimi (Click, Payme): tolovYarat(summa, valyuta = "UZS") — valyuta ko'pincha default bilan.
• React: komponentlar ma'lumotni props orqali oladi. Props — aslida funksiya parametrlarining o'zi.
• Kutubxonalar: hujjatlarida har bir funksiyaning parametrlari, tartibi va default qiymatlari yoziladi. Hujjat o'qishni o'rganish — shu jadvalni o'qishni o'rganish demak.

Parametr ko'payib ketsa (4–5 ta), tartibni eslab qolish qiyinlashadi. Real kodda bunday holatda bitta obyekt parametr beriladi — buni Parametrda destructuring va options obyekti darsida o'rganamiz.

Intervyuda ko'p beriladigan savollar: "Parametr va argument farqi nima?" va "Default qiymat qachon ishlaydi?". To'g'ri javob: faqat argument undefined bo'lganda — null yoki 0 da emas.

Xulosa

• Parametr — e'londagi nom, argument — chaqiruvdagi haqiqiy qiymat.
• Argumentlar parametrlarga nomiga qarab emas, tartibiga qarab beriladi.
• Argument kam bo'lsa — parametr undefined, ko'p bo'lsa — ortiqchasi tashlanadi. JS xato bermaydi.
• function f(x = 5) — default qiymat faqat undefined da ishlaydi va har chaqiruvda qaytadan hisoblanadi.
• Default qiymatli parametrlar ro'yxat oxirida tursin.
• arguments — eski usul, yangi kodda rest parametrlar ishlatiladi.

Keyingi dars: return va erta qaytish — funksiya natijani konsolga chiqarmasdan, uni qaytarib berishini o'rganamiz.