Exemplu de excepție cu atribute data- în JavaScript

Să presupunem că la încărcarea paginii, serverul creează cod HTML în care sunt stocate denumirea, prețul și cantitatea produsului cumpărat:

html<div id="product" data-product="măr" data-price="1000" data-amount="5"></div>

Să creăm o funcție care va accepta o referință la elementul cu produsul și va calcula valoarea totală a mărfii (prețul înmulțit cu cantitatea):

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

Să aflăm costul produsului nostru:

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

alert(cost);

Să presupunem acum următoarea situație: din cauza unei defecțiuni pe server, acesta ne-a trimis un produs în care lipsește prețul sau cantitatea (sau ambele deodată), de exemplu, astfel:

html<div id="product" data-product="măr" data-price="1000"></div>

Dacă acum încercăm să calculăm costul produsului, rezultatul afișat pe ecran va fi NaN. Sunteți de acord, nu foarte informativ.

Se pare că trebuie să ne protejăm cumva împotriva absenței atributelor de care avem nevoie. Acest lucru se poate face în două moduri. Prima modalitate este de a spune că acesta este un comportament normal și pur și simplu să verificăm prezența atributelor necesare cu if-uri:

javascriptfunction getCost(elem) {
  if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
    return elem.dataset.price * elem.dataset.amount;
  } else {
    return 0; // returnăm ceva, de exemplu, 0 sau null sau false
  }
}

A doua opțiune - este de a spune că absența atributului data-price sau data-amount - este o situație excepțională. În acest caz vom arunca o excepție:

javascriptfunction getCost(elem) {
  if (elem.dataset.price !== undefined && elem.dataset.amount !== undefined) {
    return elem.dataset.price * elem.dataset.amount;
  } else {
    throw {
      name: 'ProductCostError',
      message: 'lipsește prețul sau cantitatea produsului'
    };
  }
}

Care dintre cele două opțiuni este mai potrivită de aplicat aici - este alegerea programatorului. El poate considera problema ca fiind o funcționare normală a scriptului sau o situație excepțională.

Să presupunem că am decis că situația este excepțională. Atunci codul de obținere a costului produsului va arăta astfel:

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

try {
  let cost = getCost(product);
  alert(cost);
} catch (error) {
  // reacționăm cumva la excepție
}