Odločitve v JavaScriptu

V programih JavaScript se pogosto odločamo med več možnostmi oziroma izvedemo določene stavke samo takrat, ko je izpolnjen določen pogoj. Takšne naloge rešujemo s pogojnim izrazom, s pogojnimi stavki if, else in else if ter s stavkom switch.

Osnovna pravila

• Pogojni izraz ? : vrne eno od dveh vrednosti glede na pogoj.
• Stavek if uporabimo, kadar želimo določen del kode izvesti le ob izpolnjenem pogoju.
• Stavek else določimo za primer, ko pogoj ni izpolnjen.
• Stavek else if uporabimo, kadar preverjamo več možnosti zapored.
• Stavek switch je primeren takrat, ko primerjamo eno vrednost z več možnimi stalnimi vrednostmi.

Primerjave

Pogojni izraz

Pogojni izraz je edini operator v JavaScriptu, ki ima tri operande. Gre za krajši zapis preproste odločitve tipa »če velja pogoj, uporabi eno vrednost, sicer drugo«.

Če ima pogoj vrednost, ki se obravnava kot resnična, dobi izraz vrednost izraz1, sicer pa vrednost izraz2.

let x = 10;
let y = -5;

let min = x < y ? x : y;
let max = x > y ? x : y;
let abs = y < 0 ? -y : y;

Oglejmo si še primer, kjer datum izpišemo z vodilnimi ničlami:

<p id="primer1"></p>
<script>
{
   let danDatum = 7;
   let mesecDatum = 2;
   let letoDatum = 2015;

   let izpis = "Datum: "
      + (danDatum < 10 ? "0" : "") + danDatum + "."
      + (mesecDatum < 10 ? "0" : "") + mesecDatum + "."
      + letoDatum;

   document.getElementById("primer1").textContent = izpis;
}
</script>

Pogojni stavki

Pogojni stavek uporabimo, kadar želimo izvesti določen stavek ali blok stavkov samo v primeru, ko je izpolnjen nek pogoj.

if

Stavek if uporabimo, kadar želimo kodo izvesti samo, če je pogoj izpolnjen.

Če želimo ob izpolnjenem pogoju izvesti več stavkov, jih zapišemo med zavite oklepaje:

if (pogoj) {
   stavek1;
   stavek2;
}

<p id="primer2"></p>
<script>
{
   let starost = 20;
   if (starost >= 18) {
      document.getElementById("primer2").textContent = "Oseba je polnoletna.";
   }
}
</script>

else

Če želimo določiti tudi dejanje za primer, ko pogoj ni izpolnjen, uporabimo else.

if (pogoj) {
   stavek1;
} else {
   stavek2;
}

<p id="primer3"></p>
<script>
{
   let starost = 15;
   if (starost >= 18) {
      document.getElementById("primer3").textContent = "Oseba je polnoletna.";
   } else {
      document.getElementById("primer3").textContent = "Oseba še ni polnoletna.";
   }
}
</script>

else if

Kadar imamo na izbiro več možnosti, uporabimo zaporedje if, else if in po potrebi še else.

<p id="primer4"></p>
<script>
{
   let stevilo = 15;

   if (stevilo > 10 && stevilo % 2 === 0) {
      document.getElementById("primer4").textContent = "Sodo število, večje od 10.";
   } else if (stevilo > 10 && stevilo % 2 !== 0) {
      document.getElementById("primer4").textContent = "Liho število, večje od 10.";
   } else if (stevilo % 2 === 0) {
      document.getElementById("primer4").textContent = "Sodo število, ki ni večje od 10.";
   } else {
      document.getElementById("primer4").textContent = "Liho število, ki ni večje od 10.";
   }
}
</script>

switch

Namesto daljšega zaporedja stavkov if...else if lahko uporabimo stavek switch, kadar primerjamo eno vrednost z več možnimi stalnimi vrednostmi.

switch (izraz) {
   case vrednost1:
      stavek1;
      break;
   case vrednost2:
      stavek2;
      break;
   default:
      stavek3;
}

Stavek switch uporablja strogo primerjavo med vrednostjo izraza in posameznimi možnostmi case. Če izpustimo break, se izvajanje nadaljuje tudi v naslednjem primeru.

<p id="primer5"></p>
<script>
{
   let stevilkaDneva = 5;
   let imeDneva;

   switch (stevilkaDneva) {
      case 1:
         imeDneva = "ponedeljek";
         break;
      case 2:
         imeDneva = "torek";
         break;
      case 3:
         imeDneva = "sreda";
         break;
      case 4:
         imeDneva = "četrtek";
         break;
      case 5:
         imeDneva = "petek";
         break;
      case 6:
         imeDneva = "sobota";
         break;
      case 7:
         imeDneva = "nedelja";
         break;
      default:
         imeDneva = "Napačen vnos.";
   }

   document.getElementById("primer5").textContent = imeDneva;
}
</script>

Priporočila

• Pogojni izraz ? : uporabljaj pri krajših in preglednih odločitvah.
• Za daljše ali bolj zapletene odločitve uporabljaj if...else.
• Pri več možnostih, ki temeljijo na eni vrednosti, razmisli o uporabi switch.
• Pri primerjavah pogojev praviloma uporabljaj operatorje === in !==.
• Pri pogojnih stavkih uporabljaj bloke z zavitimi oklepaji tudi takrat, ko vsebujejo samo en stavek.

Pogoste napake

• Pogojni izraz se uporablja za predolge ali nepregledne odločitve.
• Pri pogojih se uporablja ==, čeprav je pogosto primernejši ===.
• V stavku switch manjka break, zato se izvede več primerov zapored.
• Zaporedje stavkov if...else if je zapisano nepregledno in brez blokov kode.
• Pri zapisu kode so napačno uporabljena imena metod ali elementov dokumenta.