JavaScript-da data- atributlari bilan bog'liq istisno misoli

Veb-sahifa yuklanganda server HTML kod yaratadi, unda mahsulot nomi, narxi va sotib olingan miqdori saqlanadi:

<div id="product" data-product="olma" data-price="1000" data-amount="5"></div>

Keling, mahsulot elementi havolasini qabul qiladigan va tovarning umumiy qiymatini (narxni miqdorga ko'paytirish) topadigan funksiya yarataylik:

function getCost(elem) {
	return elem.dataset.price * elem.dataset.amount;
}

Keling, mahsulotimizning qiymatini topamiz:

let product = document.querySelector('#product');
let cost = getCost(product);

alert(cost);

Endi quyidagi vaziyatni tasavvur qilaylik: serverdagi ba'zi nosozliklar tufayli u bizga narx yoki miqdor (yoki ikkalasi bir vaqtda) yo'q mahsulot yubordi, masalan, shu tarzda:

<div id="product" data-product="olma" data-price="1000"></div>

Agar endi mahsulot qiymatini hisoblashga harakat qilsak, natijada ekranda NaN chiqadi. Siz ham rozisiz, bu juda ma'lumotli emas.

Ma'lum bo'ladiki, biz kerakli atributlarning yo'qligidan o'zimizni qandaydir tarzda himoya qilishimiz kerak. Buni ikki yo'l bilan amalga oshirish mumkin. Birinchi yo'l - bu normal holat deb aytish va kerakli atributlarning mavjudligini if lar bilan tekshirish:

function getCost(elem) {
	if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
		return elem.dataset.price * elem.dataset.amount;
	} else {
		return 0; // biron narsa qaytaramiz, masalan, 0 yoki null yoki false
	}
}

Ikkinchi variant - bu data-price yoki data-amount atributining yo'qligi istisno holatidir deb aytish. Bunday holda biz istisno chiqaramiz (throw):

function getCost(elem) {
	if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
		return elem.dataset.price * elem.dataset.amount;
	} else {
		throw {
			name: 'ProductCostError',
			message: 'mahsulotda narx yoki miqdor yoʻq'
		};
	}
}

Bu erda qaysi variantni qo'llash maqbulroq - bu dasturchining tanloviga bog'liq. U muammoni skriptning normal ishlashi yoki istisno holati deb hisoblashi mumkin.

Faraz qilaylik, biz vaziyat istisno ekanligiga qaror qildik. Unda mahsulot qiymatini olish kodi shunday ko'rinadi:

let product = document.querySelector('#product');

try {
	let cost = getCost(product);
	alert(cost);
} catch (error) {
	// istisnoga qandaydir tarzda reaktsiya qilamiz
}

Mening kodimni shunday o'zgartiringki, getCost funksiyasi ikki turdagi istisnolarni chiqarsin: agar narx yo'q bo'lsa va agar miqdor yo'q bo'lsa. Bu istisnolarning nomlari ustida yaxshi o'ylab ko'ring. catch blokida turli turlardagi istisnolar uchun har xil xato xabarlarini chiqaring.