Primer izjeme z data-atributi v JavaScript

Naj ob nalaganju strani strežnik ustvari HTML kodo, v kateri so shranjeni naziv, cena in količina kupljenega izdelka:

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

Naredimo funkcijo, ki bo sprejela referenco na element z izdelkom in poiskala skupno ceno blaga (ceno pomnožimo s količino):

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

Poiščimo ceno našega izdelka:

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

alert(cost);

Predpostavimo zdaj naslednjo situacijo: zaradi nekake okvare na strežniku nam je poslal izdelek, v katerem manjka cena ali količina (ali oboje hkrati), na primer takole:

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

Če zdaj poskusimo izračunati ceno izdelka, se bo kot rezultat na zaslonu izpisal NaN. Strinjate se, da ni zelo informativno.

Izkazalo se je, da se moramo na nek način zaščititi pred tem, da bodo manjkali potrebni atributi. To je mogoče storiti na dva načina. Prvi način je reči, da je to obnašanje normalno in preprosto preveriti z if stavki prisotnost potrebnih atributov:

function getCost(elem) {
	if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
		return elem.dataset.price * elem.dataset.amount;
	} else {
		return 0; // vrnemo kaj, na primer 0 ali null ali false
	}
}

Druga možnost je reči, da odsotnost atributa data-price ali data-amount - je izjemna situacija. V tem primeru bomo vrgli izjemo:

function getCost(elem) {
	if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
		return elem.dataset.price * elem.dataset.amount;
	} else {
		throw {
			name: 'ProductCostError',
			message: 'manjka cena ali količina pri izdelku'
		};
	}
}

Kateri od obeh variant je tu primerneje uporabiti - je izbira programerja. Lahko šteje težavo za normalno delovanje skripta ali za izjemno situacijo.

Recimo, da smo se odločili, da je situacija izjemna. Tedaj bo koda za pridobitev cene izdelka videti takole:

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

try {
	let cost = getCost(product);
	alert(cost);
} catch (error) {
	// nekako se odzovemo na izjemo
}

Predelajte mojo kodo tako, da bo funkcija getCost vrgla dve vrsti izjem: če manjka cena in če manjka količina. Dobro razmislite o imenih teh izjem. V bloku catch izpišite različna sporočila o napaki za izjeme različnih vrst.