Optimize if/else statement

Question

I wrote the following code to simulate and simplify what is happening in my application.

In this simplification, I have the if and else branch that are executing the same code

async function manipulDom(e) {
  const URItwo = `https://bank.gov.ua/NBUStatService/v1/statdirectory/exchange?json`;
  let response = await fetch(URItwo);
  var data = await response.json();
  console.log(data);
  for (var key in data) {
    if (data[key].cc == "USD") {
      rateone.innerHTML =
        data[key].txt + ` ` + data[key].rate.toFixed(2) + `грн`;
      cursUSD = data[key].rate.toFixed(2);
      console.log(cursUSD);
    } else if (data[key].cc == "EUR") {
      ratetwo.innerHTML =
        data[key].txt + ` ` + data[key].rate.toFixed(2) + `грн`;
      cursEUR = data[key].rate.toFixed(2);
      console.log(cursEUR);
    } else if (data[key].cc == "PLN") {
      ratetree.innerHTML =
        data[key].txt + ` ` + data[key].rate.toFixed(2) + `грн`;
      cursPLN = data[key].rate.toFixed(2);
      console.log(cursPLN);
      return;
    }
  }
}

Where are `cursUSD`, `cursEUR` and `cursPLN` declared? Please `"use strict"`. Also, are you deliberately breaking the loop early when `PLN` comes up, or is it a typo? — Amadan, Oct 04 '19 at 05:38
Use ternary operator instead of if-else statement. Refer below link: https://www.thoughtco.com/javascript-by-example-use-of-the-ternary-operator-2037394 — ashish bandiwar, Oct 04 '19 at 05:39
@Amadan They are not declared anywhere.But this variables needs in In other functions — Yura Khomitsky, Oct 04 '19 at 05:41
Under strict JavaScript, that's an error. This helps you catch a lot of errors you otherwise wouldn't. It's a better practice to either not have global variables, or if you really have to, explicitly reference them from `window`. — Amadan, Oct 04 '19 at 05:41

CertainPerformance · Accepted Answer · 2019-10-04T05:54:13.460

Use objects indexed by the currency abbreviations instead:

const cursObj = {
  USD: <value of cursUSD>,
  EUR: <value of cursEUR>,
  PLN: <value of cursPLN>
};
const rateElementsByCurrency = {
  USD: rateone,
  EUR: rateTwo,
  PLN: rateThree
}

async function manipulDom(e) {
  const URItwo = `https://bank.gov.ua/NBUStatService/v1/statdirectory/exchange?json`;
  const response = await fetch(URItwo);
  const data = await response.json();
  data.forEach((obj) => {
    const { cc } = obj;
    if (cursObj[cc]) {
      cursObj[cc] = obj.rate.toFixed(2);
      rateElementsByCurrency[cc].textContent = obj.txt + ` ` + cursObj[cc] + `грн`;
      // If you're familiar with template literals, then you can do instead:
      // rateElementsByCurrency[cc].textContent = `${obj.txt} ${cursObj[cc]}грн`;
    }
  });
}

Because data is an array, not an object, iterate over it with forEach - don't use `for..in to iterate over arrays.

Because you want to put text into the rateElementsByCurrency elements, rather than HTML, you should use textContent instead of innerHTML, it's safer, quicker, and more predictable.

More elegant and complete than mine – mplungjan Oct 04 '19 at 05:51 — mplungjan, Oct 04 '19 at 05:51

score 0 · Answer 2 · answered Oct 04 '19 at 06:46

Try This

async function manipulDom(e) {
  const URItwo = `https://bank.gov.ua/NBUStatService/v1/statdirectory/exchange?json`;
  const response = await fetch(URItwo);
  const data = await response.json();
  var cc = ["USD", "EUR", "PLN"];
  var exchangeRates = {};  
  for(value of data){
      if(cc.includes(value.cc)){
          let index = cc.indexOf(value.cc);
          cc.splice(index,index+1);
          value.rate = Number(value.rate).toFixed(2);
          exchangeRates[value.cc] = value;  
      }
      if(cc.length < 1){break;}

  }
  console.log(exchangeRates);
}
manipulDom();

Optimize if/else statement

2 Answers2