javascript - 我如何重构多个 if…else if 以提高效率？

Question

我有一个根据 cartTotal 金额计算费用的应用程序。它将通过使用 [MutationObserver][1] 捕获总量的变化。当总数发生变化时，应根据 2 个数组应用不同的费用:1 个用于 carttotal 步数和相应的费用。

我想提高效率并避免使用所有这些 else if 语句。当在 MutationObserver 中观察到变化时，我是否应该使用被调用的函数？我可以有效地利用 firstIndex 吗？

var fees = ["10","20","30"];
var steps = ["99.90","1200.00","3600.00"];
var observer = new MutationObserver(function (mutations) {
var cartTotal = parseFloat($('.total').html())
//apply different fee based on cart total
if (cartTotal <= 0) {
  shippingFee = 0;
} else if (cartTotal > 0 && cartTotal <= steps[0]) {
  shippingFee = fees[0];
} else if (cartTotal > steps[0] && cartTotal <= steps[1]) {
  shippingFee = fees[1];
} else if (cartTotal > steps[1] && cartTotal <= steps[2]) {
  shippingFee = fees[2];
} else if (cartTotal > steps[2] && cartTotal <= steps[3]) {
  shippingFee = fees[3];
} else if (cartTotal > steps[3] && cartTotal <= steps[4]) {
  shippingFee = fees[4];
} else if (cartTotal > steps[4] && cartTotal <= steps[5]) {
  shippingFee = fees[5];
} else {
  shippingFee = fees[6];
}
shippingFee = parseFloat(shippingFee);

observer.observe(changetotal, {
  childList: true
  });
 });

Answer 1

你可以拿Array#findIndex和一个嵌套的三元组。

var index = steps.findIndex(v => v <= cartTotal),
    shippingFee = cartTotal <= 0
        ? 0
        : index === -1
            ? fees[6]
            : fees[index];