Pavyzdys su išimtimis naudojant data- atributus JavaScript

Tegul puslapio užkrovimo metu serveris sukuria HTML kodą, kuriame saugomas pavadinimas, kaina ir nupirktos prekės kiekis:

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

Sukurkime funkciją, kuri priims nuorodą į elementą su preke ir ras bendrą prekės savikainą (kainą padaugintą iš kiekio):

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

Raskime mūsų prekės savikainą:

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

alert(cost);

Dabar tarkime tokią situaciją: dėl kokios nors serverio gedimo jis atsiuntė mums prekę, kurioje trūksta kainos ar kiekio (arba abiejų iš karto), pavyzdžiui, taip:

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

Jei dabar bandysite apskaičiuoti savikainą prekės, rezultatas ekrane bus NaN. Sutikite, nelabai informatyvu.

Pasirodo, mes turime kaip nors apsisaugoti nuo to, kad trūks mums reikalingų atributų. Tai galima padaryti dviem būdais. Pirmas būdas - tai pasakyti, kad tai normalus elgesys ir tiesiog patikrinti if sąlygomis reikalingų atributų buvimą:

function getCost(elem) {
	if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
		return elem.dataset.price * elem.dataset.amount;
	} else {
		return 0; // grąžinsime ką nors, pavyzdžiui, 0 arba null arba false
	}
}

Antras variantas - tai pasakyti, kad atributo data-price arba data-amount trūkumas - yra išimtinė situacija. Tokiu atveju mes mėsime išimtį:

function getCost(elem) {
	if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
		return elem.dataset.price * elem.dataset.amount;
	} else {
		throw {
			name: 'ProductCostError',
			message: 'trūksta kainos ar kiekio prekei'
		};
	}
}

Kuris iš dviejų variantų čia tinkamesnis - tai programuotojo pasirinkimas. Jis gali manyti problemą normaliu scenarijaus veikimu arba išimtine situacija.

Tarkime, nusprendėme, kad situacija yra išimtinė. Tada prekės savikainos gavimo kodas atrodys taip:

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

try {
	let cost = getCost(product);
	alert(cost);
} catch (error) {
	// kaip nors reaguojame į išimtį
}

Pakeiskite mano kodą taip, kad funkcija getCost mestų dviejų tipų išimtis: jei trūksta kainos ir jei trūksta kiekio. Gerai apgalvokite šių išimčių pavadinimus. Bloke catch išveskite skirtingus klaidos pranešimus skirtingų tipų išimtims.