Question

if (one >= 16 && one <= 20){
  if (two >= 10){
    Sum.innerHTML = "$2750";
  } else {
    Sum.innerHTML = "$2500";
  }
} else if (one >= 20 && one <= 25){
  if (two >= 10){
    Sum.innerHTML = "$2500";
  } else {
    Sum.innerHTML = "$2250";
  }
}

这只是我的一些代码，只是我与朋友一起做的事情的简单货币计算器，这并不重要。我似乎无法考虑是否有任何办法可以通过使用诸如此类的功能来提高效率，因为它看起来好像是同一代码太多，而且“干”这并不是它的全部代码，这么多...不知道有没有人可以帮助您供参考，这是用js编写的，并且Sum是一个段落ID，因此可以将其视为控制台日志。

谢谢，伊桑

编辑

https://codepen.io/anon/pen/bxgYWL?editors=10100 如果您继续进行下去，则可以查看所有代码以及所有注释，我想补充一下以帮助您理解。如果它没有帮助，也没有其他方法可以使它高效，请不要担心。没关系，因为它只是一段私人代码，不会引起很多问题。

Answer 1

您可以使用数据结构保留范围边界，然后在其上循环。

var params = [
    { onelow: 16, onehigh: 20, 
      two: [ { low: -inf, high: 9, value: 2500 },
             { low: 10, high: +inf, value: 2750 }],
    },
    { onelow: 21, onehigh: 25, 
      two: [ { low: -inf, high: 9, value: 2250 },
             { low: 10, high: +inf, value: 2500 }],
    },
    ...
];

let done = false;
for(let i = 0; !done && i < params.length; i++) {
    let param = params[i];
    if (one >= param.onelow && one <= param.onehigh) {
        let done = false;
        for (let j = 0; j < param.two.length; j++) {
            let param2 = param[j];
            if (two >= param2.low && two <= param2.high) {
                Sum.innerHTML = "$" + param2.value;
                done = true; // stop the outer loop, too
                break;
            }
        }
    }
}

Answer 2

您可以按以下方式优化代码（更新）：

var temp = "$2500"
if (one >= 16 && one <= 20){  
  if (two >= 10){
    temp = "$2750";
  }
} else if (one >= 20 && one <= 25){
  if (!(two >= 10)){
    temp = "$2250";
  }
}
Sum.innerHTML = temp;

您并不需要总是编写else，可以避免上面的代码中那样。如果必须更改该值，则设置一个始终相同的值，如果满足条件，则更改该值。

我希望我的回答有意义。谢谢。

Answer 3

首先，这部分代码：

if(two >= 10)
{
    Sum.innerHTML = "$2750";
}
else
{
    Sum.innerHTML = "$2500";
}

我们可以重写为更短的代码：

Sum.innerHTML = two >= 10 ? "$2750" : "$2500";

然后因为您的这段代码一直重复着，我们可以像下面这样在函数中编写它：

function setSum(compareValue, ifValue, elseValue)
{
    Sum.innerHTML = two >= compareValue ? ifValue : elseValue
    // or even: Sum.innerHTML = two >= 10 ? ifValue : elseValue
}

然后，我们可以像以下示例中那样从 your example on codepen 中缩短您的代码：

var numOne = document.getElementById("one"),
    numTwo = document.getElementById("two"),
    Sum = document.getElementById("sum");

numOne.addEventListener("input", calc);
numTwo.addEventListener("input", calc);

function setSum(compareValue, ifValue, elseValue)
{
    Sum.innerHTML = two >= compareValue ? ifValue : elseValue
    // or even: Sum.innerHTML = two >= 10 ? ifValue : elseValue
}

function calc()
{
    var one = parseFloat(numOne.value) || 0,
        two = parseFloat(numTwo.value) || 0;

    if(one >= 16 && one <= 20)
        setSum(10, "$2750", "$2500");

    else if(one >= 20 && one <= 25)
        setSum(10, "$2500", "$2250");

    else if(one >= 25 && one <= 35)
        setSum(10, "$2000", "$1750");

    else if(one >= 35 && one <= 45)
        setSum(10, "$1500", "$1250");

    else if(one >= 45 && one <= 50)
        setSum(10, "$1250", "$1000");
}

<h4>Calculator</h4>
<p>
    <input id="one"> + <input id="two">
</p>
<p id="sum"></p>

我不太了解您的计算器的功能，但是您写道：

这只是我的一些代码，它只是我与朋友一起做的事情的简单货币计算器，这并不重要。

有没有办法让我把它变成一个功能或更有效的方法

3 个答案: