2.6-bob: String va Number metodlari
2-QISM — JavaScript (0 dan chuqurgacha) · 6-mavzu
1. Kirish va motivatsiya
this va prototype 2.5-bob dan keyin biroz "dam olamiz" — lekin nihoyatda amaliy bobda. Kundalik dasturlashning katta qismi — matn (string) va sonlar (number) bilan ishlash: foydalanuvchi ismini formatlash, narxni chiroyli ko'rsatish, email tekshirish, sanani ajratish, matnda qidirish.
JavaScript bizga tayyor metodlar beradi (2.5: ular String.prototype/Number.prototypeda yashaydi). Ularni bilsangiz — "g'ildirakni qaytadan ixtiro qilmaysiz" (0.6, 0.7), kodni qisqa va ishonchli yozasiz.
O'xshatish: string/number metodlari — oshxona pichoqlari to'plami. Har biri bitta ish uchun (kesish, archish, maydalash). Qaysi pichoq qaysi ishga — bilsangiz, tez va toza ishlaysiz. Bilmasangiz — qoshiq bilan non kesishga urinasiz.
Bu bob — ma'lumotni qayta ishlashning amaliy poydevori. Bu yerda eng ko'p ishlatiladigan metodlarni (har biriga izoh va misol bilan) o'rganamiz. Array metodlari 2.7-bob keyingi bobda — ular bu bobning g'oyasini massivlarga kengaytiradi.
2. Nazariya — chuqur tushuntirish
2.1. Muhim tushuncha: string — o'zgarmas (immutable)
String o'zgarmas (immutable) — metod stringni o'zgartirmaydi, balki yangi string qaytaradi (2.1: primitiv). Bu — eng muhim tushuncha:
let s = "salom";
s.toUpperCase(); // "SALOM" qaytaradi, LEKIN s o'zgarmaydi
console.log(s); // "salom" (eski!)
s = s.toUpperCase(); // natijani QAYTA TAYINLASH kerak
console.log(s); // "SALOM"Eng ko'p uchraydigan xato:
s.toUpperCase()deb yozib, natijani tayinlamaslik. String metodlari natijani qaytaradi — uni ushlash kerak.
2.2. String — indeks va uzunlik
String — belgilar ketma-ketligi; har belgining indeksi bor (0 dan boshlanadi — 0.1):
const s = "Salom";
s.length; // 5 (uzunlik)
s[0]; // "S" (birinchi belgi)
s[s.length-1]; // "m" (oxirgi)
s.charAt(1); // "a" (indeks bo'yicha)
s.at(-1); // "m" (oxirgi — manfiy indeks, zamonaviy va qisqa)
s.at(-2); // "o" (oxiridan ikkinchi)
at— qulay yangilik:s[s.length-1]o'rnigas.at(-1)oxirgi belgini olib beradi.s[-1]esa ishlamaydi (undefinedqaytaradi — kvadrat qavs manfiyni qo'llamaydi), shuning uchun oxiridan sanashdaatishlating.
2.3. Asosiy String metodlari — qidirish va tekshirish
const s = "Salom, Dunyo!";
s.includes("Dunyo"); // true — ichida bormi?
s.startsWith("Salom"); // true — shu bilan boshlanadimi?
s.endsWith("!"); // true — shu bilan tugaydimi?
s.indexOf("o"); // 4 — birinchi "o" indeksi (yo'q bo'lsa -1)
s.lastIndexOf("o"); // 10 — oxirgi "o"2.4. Kesish va ajratish
const s = "Salom, Dunyo!";
s.slice(0, 5); // "Salom" — [boshlang'ich, oxir) — eng ko'p ishlatiladi
s.slice(-6); // "Dunyo!" — manfiy = oxiridan
s.substring(7, 12); // "Dunyo" — slice'ga o'xshash (manfiyni qo'llamaydi)
s.split(", "); // ["Salom", "Dunyo!"] — ajratuvchi bo'yicha MASSIVga
s.split(""); // ["S","a","l",...] — har belgi
"a,b,c".split(","); // ["a","b","c"]
split— juda muhim: matnni massivga aylantiradi (keyin Array metodlari — 2.7 bilan ishlash mumkin).join2.7-bob — teskarisi (massivni matnga).
2.5. O'zgartirish va tozalash
const s = " Salom Dunyo ";
s.trim(); // "Salom Dunyo" — chetdagi bo'shliqlarni olib tashlaydi
s.toUpperCase(); // " SALOM DUNYO "
s.toLowerCase(); // " salom dunyo "
s.replace("Salom", "Hi"); // birinchi "Salom"ni almashtiradi
s.replaceAll("o", "0"); // BARCHA "o"ni almashtiradi
s.repeat(3); // matnni 3 marta
"5".padStart(3, "0"); // "005" — chapni to'ldirib (0.1: binary ko'rsatish)
"5".padEnd(3, "0"); // "500"2.6. Number — asosiy metodlar
const n = 3.14159;
n.toFixed(2); // "3.14" — kasr qismni 2 xonaga (MATN qaytaradi!)
n.toFixed(0); // "3"
(1234.5).toLocaleString("uz"); // "1 234,5" — mahalliy format (ajratuvchi bilan)
(255).toString(16); // "ff" — boshqa sanoq sistemaga (0.1!)
(255).toString(2); // "11111111" — binary (0.1)
toFixedMATN qaytaradi:3.14-bob.toFixed(1)"3.1"(string!). Yana son kerak bo'lsa —Number(n.toFixed(2))yoki+n.toFixed(2)(2.1: coercion).
Intl.NumberFormat — professional raqam/valyuta formatlash
toLocaleString qulay, lekin bir xil formatni ko'p marta ishlatganda (masalan ro'yxatdagi har bir narx) yangi formatlovchi obyektni bir marta yaratib, qayta-qayta format chaqirgan tezroq va aniqroq. Intl.NumberFormat — shu maqsad uchun standart vosita (ichida toLocaleString ham aynan shuni ishlatadi):
// Oddiy raqam — ming ajratuvchi bilan
const raqam = new Intl.NumberFormat("uz-UZ");
raqam.format(1990000); // "1 990 000"
// Valyuta — belgi/kod bilan (style: "currency")
const som = new Intl.NumberFormat("uz-UZ", { style: "currency", currency: "UZS" });
som.format(19990); // "19 990 UZS" (lokalga qarab belgi joylashuvi)
const dollar = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
dollar.format(1234.5); // "$1,234.50"
// Foiz (style: "percent" — qiymat 0..1 oralig'ida beriladi)
new Intl.NumberFormat("uz-UZ", { style: "percent" }).format(0.25); // "25%"
// Kasr xonalarini cheklash
new Intl.NumberFormat("uz-UZ", {
minimumFractionDigits: 2,
maximumFractionDigits: 2,
}).format(3.14159); // "3,14"Qachon nima: bir martalik formatlash uchun
toLocaleStringqisqa va yetarli; bir xil formatni takror ishlatganda (sikl, jadval)Intl.NumberFormatobyektini bir marta yarating vaformatni qayta-qayta chaqiring.
2.7. Matnni songa, sonni matnga aylantirish
// Matn son (2.1: kirish odatda string)
Number("42"); // 42
Number("3.14"); // 3.14
Number("abc"); // NaN (0.1)
parseInt("42px"); // 42 — boshidagi butun sonni oladi
parseFloat("3.14m"); // 3.14 — kasr bilan
+"42"; // 42 — qisqa yo'l (unary +)
// Son matn
String(42); // "42"
(42).toString(); // "42"
`${42}`; // "42" (template literal — 2.1)2.8. Number va Math — tekshirish va hisob
Number.isInteger(5); // true
Number.isNaN(NaN); // true — NaN'ni tekshirish (0.1, 2.1)
Number.isFinite(Infinity); // false
Number.MAX_SAFE_INTEGER; // eng katta xavfsiz butun (0.1: BigInt chegarasi)
// Math — matematik funksiyalar
Math.round(4.6); // 5 yaxlitlash
Math.floor(4.9); // 4 pastga
Math.ceil(4.1); // 5 yuqoriga
Math.max(1, 5, 3); // 5
Math.min(1, 5, 3); // 1
Math.abs(-7); // 7 modul
Math.random(); // 0..1 oralig'ida tasodifiy (0.6: tasodif)
Math.sqrt(16); // 4 ildiz
Math.pow(2, 10); // 1024 (yoki 2 ** 10 — 2.1)Tasodifiy butun son (juda ko'p kerak bo'ladi):
js// min..max oralig'ida tasodifiy butun Math.floor(Math.random() * (max - min + 1)) + min;
3. Sintaksis — tez ma'lumotnoma
// STRING (o'zgarmas — natijani tayinla!)
s.length s[i] s.charAt(i) s.at(-1)
s.includes(x) s.startsWith(x) s.endsWith(x) s.indexOf(x)
s.slice(a, b) s.substring(a, b) s.split(sep)
s.trim() s.toUpperCase() s.toLowerCase()
s.replace(a, b) s.replaceAll(a, b) s.repeat(n) s.padStart(n, ch)
// NUMBER
n.toFixed(d) n.toString(asos) n.toLocaleString()
Number(s) parseInt(s) parseFloat(s) +s
Number.isInteger(n) Number.isNaN(n)
new Intl.NumberFormat(locale, opts).format(n) // takroriy/valyuta format
// MATH
Math.round/floor/ceil/abs/max/min/random/sqrt/pow4. Batafsil kod namunalari
Misol 1 — Matnni tozalash va formatlash
let ism = " aLi vALIYEV ";
// Tozalash zanjiri (chaining — metodlar ketma-ket)
ism = ism.trim().toLowerCase(); // "ali valiyev"
console.log(ism);
// Har so'zning birinchi harfini katta qilish
const formatlangan = ism
.split(/\s+/) // bo'shliqlar bo'yicha massivga (2.4)
.map(soz => soz[0].toUpperCase() + soz.slice(1)) // har so'z (2.7: map)
.join(" "); // qayta birlashtirish (2.7)
console.log(formatlangan); // "Ali Valiyev"Misol 2 — Narxni chiroyli formatlash (0.1: pul)
function narxFormat(tiyin) {
const som = tiyin / 100; // tiyin so'm (0.1: pulni butun saqlash)
return som.toLocaleString("uz-UZ") + " so'm";
}
console.log(narxFormat(1999000)); // "19 990 so'm"
// toFixed — kasrni qat'iy 2 xona (lekin MATN — 2.6)
const ulush = 1 / 3;
console.log(ulush.toFixed(2)); // "0.33"Misol 3 — Email/telefonni tekshirish va ajratish
const email = "Ali.Valiyev@Gmail.COM";
// Normalizatsiya (2.5)
const toza = email.trim().toLowerCase(); // "ali.valiyev@gmail.com"
// Oddiy tekshirish (RegEx — 2.13-bobda chuqur)
const togriMi = toza.includes("@") && toza.includes(".");
console.log(togriMi); // true
// Domen va foydalanuvchini ajratish (2.4)
const [foydalanuvchi, domen] = toza.split("@"); // destructuring (2.8)
console.log(foydalanuvchi); // "ali.valiyev"
console.log(domen); // "gmail.com"Misol 4 — Sonlar bilan ishlash
// Foydalanuvchi kiritgan "son" — string (2.7)
const kiritilgan = "42px";
const son = parseInt(kiritilgan); // 42 (px tushib qoladi)
console.log(Number.isNaN(son) ? "Xato" : son * 2); // 84
// Tasodifiy butun son (1..6 — zar) (2.8)
const zar = Math.floor(Math.random() * 6) + 1;
console.log(`Zar: ${zar}`);
// Yaxlitlash va format
const ortacha = (85 + 92 + 78) / 3;
console.log(ortacha.toFixed(1)); // "85.0"
console.log(Math.round(ortacha)); // 855. To'g'ri va noto'g'ri holatlar
1) String metod natijasini tayinlamaslik
// string o'zgarmas — natija yo'qoladi (2.1)
let s = "salom";
s.toUpperCase();
console.log(s); // "salom" (o'zgarmadi!)
// natijani tayinla
s = s.toUpperCase();2) toFixed natijasini son deb ishlatish
// toFixed MATN qaytaradi (2.6)
const jami = (5.5).toFixed(2) + 1; // "5.501" (matn birlashtirish!)
// qayta songa
const jami = Number((5.5).toFixed(2)) + 1; // 6.53) == bilan son/matn taqqoslash (coercion)
// "5" string sifatida keladi (2.1)
if (kiritilgan == 5) { }
// aniq aylantir, keyin ===
if (Number(kiritilgan) === 5) { }4) NaNni === bilan tekshirish
// NaN === NaN false (!!) — JS xususiyati
if (x === NaN) { } // hech qachon true bo'lmaydi
//
if (Number.isNaN(x)) { }6. Keng tarqalgan xatolar va yechimlari
Xato 1 — Cannot read properties of undefined (reading 'toUpperCase')
Sababi: undefined/nullda string metod chaqirildi. Yechimi: avval tekshiring (if (s) yoki s?.toUpperCase() — 2.1 optional chaining).
Xato 2 — NaN natija
Sababi: noto'g'ri matn songa aylantirildi (Number("abc") — 0.1). Yechimi: Number.isNaN() bilan tekshiring; parseInt/parseFloat ehtiyotkorlik bilan.
Xato 3 — toFixed floating point xatosi
(1.005).toFixed(2); // "1.00" (kutilgan "1.01") — 0.1 floating point!Sababi: binary floating point (0.1-bob). Yechimi: pul uchun tiyin/butun son sifatida saqlang 0.1-bob; aniq kerak bo'lsa maxsus kutubxona.
Xato 4 — slice vs splice chalkashligi
Sababi: slice (string/array — nusxa, o'zgartirmaydi) va splice (faqat array — o'zgartiradi, 2.7) aralash. Yechimi: string uchun slice; massivni o'zgartirmaslik uchun ham slice.
Xato 5 — Bo'shliq/registr tufayli taqqoslash xatosi
"Ali" === "ali " // false (registr + bo'shliq)Sababi: taqqoslashdan oldin normalizatsiya yo'q. Yechimi: .trim().toLowerCase() bilan normalizatsiya (Misol 3).
7. Integratsiya — bu mavzu stack'ning qayerida uchraydi
- Array metodlari 2.7-bob:
splitmassiv.map/.filterjoin(Misol 1). - RegEx 2.13-bob: murakkab matn qidirish/almashtirish (
replaceregex bilan). - DOM 2.16-bob: foydalanuvchi kiritgan matnni tozalash/formatlash.
- Validatsiya 5.9-bob: email/telefon tekshirish (Misol 3).
- Backend (5): so'rov ma'lumotini (string) qayta ishlash, songa aylantirish.
- Sana 2.9-bob: sanani matnga formatlash;
toLocaleString. - Pul/format 0.1-bob:
toLocaleString,toFixed, tiyin sifatida saqlash.
8. Eng yaxshi amaliyotlar (best practices)
- String o'zgarmas — natijani tayinlang 2.1-bob. Metodlarni zanjirlang (
.trim().toLowerCase()). - Taqqoslashdan oldin normalizatsiya (
.trim().toLowerCase()) — registr/bo'shliq bug'lari. toFixedMATN qaytaradi — son kerak bo'lsaNumber()2.6-bob.Number.isNaN()bilan tekshiring (=== NaNishlamaydi — 6-bo'lim).- Pulni tiyin (butun son) sifatida saqlang,
toFixedga tayanmang 0.1-bob. split/joinbilan stringmassiv o'rtasida erkin o'ting 2.7-bob.?.bilanundefinedda metod chaqirishdan himoyalaning 2.1-bob.- Mahalliy format uchun
toLocaleString(sana, pul, son); takror/valyuta uchunIntl.NumberFormatni bir marta yarating 2.6-bob. - Oxirgi belgi uchun
s.at(-1)—s[s.length-1]dan qisqa va o'qiluvchanroq 2.2-bob.
9. Amaliy loyiha: "Matn va Son Utility To'plami"
String/number metodlarini amalda mustahkamlovchi foydali funksiyalar.
Maqsad
String va number metodlarini birlashtirib, real matn/son qayta ishlash vazifalarini hal qiluvchi toza funksiyalar yozish.
Talablar (requirements)
sarlavhaFormat(matn)— har so'zning birinchi harfini katta qiladi (Title Case — Misol 1).slug(matn)— matnni URL-do'st qiladi: kichik harf, bo'shliqlar-, chetdagi bo'shliq olib tashlanadi (masalan"Salom Dunyo""salom-dunyo").narxFormat(tiyin)— tiyinni"19 990 so'm"ko'rinishida (Misol 2, 0.1).telefonFormat(raqam)—"998901234567""+998 90 123 45 67"(slice/+bilan).qisqartir(matn, uzunlik)— matn uzun bo'lsa kesib"..."qo'shadi (masalan"Juda uzun matn", 8"Juda uz...").tasodifiyParol(uzunlik)— berilgan uzunlikda tasodifiy parol (harf+raqam —Math.random, 2.8).sonAjrat(matn)—"Narx: 42 000 so'm"dan faqat sonni ajratib oladi (parseInt/replace).- Har funksiyani chegaraviy holat (bo'sh matn,
undefined) bilan sinang 0.6-bob.
Maslahatlar (hint)
- Title Case:
splitmap(2.7)join(Misol 1). - Slug:
.trim().toLowerCase().replaceAll(" ", "-")2.5-bob. - Telefon:
slicebilan bo'laklarni oling, template literal bilan birlashtiring 2.1-bob. - Tasodifiy parol: belgilar stringidan
Math.floor(Math.random() * len)indeks bilan tanlang 2.8-bob. undefineddan himoya:s?.trim()yoki boshidaif (!matn) return "".
"Tayyor" mezonlari (acceptance criteria)
- Barcha 7 funksiya to'g'ri ishlaydi.
-
narxFormatming ajratuvchi bilan (toLocaleString). -
slugto'g'ri URL-do'st natija beradi. -
telefonFormatto'g'ri bo'laklaydi. -
qisqartirfaqat kerakli holatda kesadi. -
tasodifiyParolhar safar har xil natija beradi. - Chegaraviy holatlar (bo'sh/undefined) qulamaydi.
- String metod natijalari to'g'ri tayinlangan 2.1-bob.
Yechim kodi ataylab berilmagan — bu loyihani o'zingiz yozib ko'ring.
10. Xulosa va keyingi bobga ko'prik
Bu bobda matn va sonlarni qayta ishlashning amaliy qurolini o'rgandik:
- String — o'zgarmas (immutable): metod yangi qiymat qaytaradi — natijani tayinlang.
- Qidirish:
includes,indexOf,startsWith/endsWith; kesish:slice,split; tozalash:trim,toUpperCase,replace/replaceAll,padStart. - Number:
toFixed(matn qaytaradi!),toString(asos)0.1-bob,toLocaleString/Intl.NumberFormat(valyuta/raqam format); aylantirish:Number(),parseInt,+. Number.isNaN(=== NaNemas),Math(round/floor/random/max...).- Tuzoqlar: natijani tayinlamaslik,
toFixedmatn,==coercion, floating point 0.1-bob.
Keyingi bob — 2.7-bob: Array va barcha metodlari (map, filter, reduce, find, ...). Stringni massivga aylantirdik (split); endi massivlarni chuqur o'rganamiz. Array metodlari — .map, .filter, .reduce — zamonaviy JS va React (11) ning eng ko'p ishlatiladigan vositasi. Bu — funksional dasturlashning amaliy yuragi.
Foydalanilgan rasmiy/ishonchli manbalar
- MDN Web Docs —
String(prototype metodlari), string immutability - MDN Web Docs —
Number,Number.prototype.toFixed,parseInt/parseFloat - MDN Web Docs —
Math,Number.isNaN/isInteger - MDN Web Docs —
String.prototype.at,Intl.NumberFormat
Izohlar (0)
Izoh yozish uchun kiring.
- Hozircha izoh yo'q. Birinchi bo'ling!