微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

JS表单计算器

如何解决JS表单计算器

我将这个简单的计算器作为我在 JS 中的第一个项目。我参加了一门课程,他们告诉我,程序员很“懒惰”,所以他们试图编写尽可能少的代码。我的问题来了。我认为我的计算器代码很长。我想知道,是否有任何方法可以用更少的代码完成这个。谢谢你的时间,祝你有美好的一天:)

function result() {
    var amount = parseInt(document.getElementById("number").value);
    var size = document.getElementById("velikost").value;
    var color = document.getElementById("barva").value;
    var price;
    
    if(amount <= 19) {
        if((size == 1) && (color == 1)) {
            price = 2.5
        }
        else if ((size == 1) && (color == 2)) {
            price = 3
        }
        else if ((size == 1) && (color == 3)) {
            price = 9.9
        }
        else if ((size == 1) && (color == 4)) {
            price = 10.9
        }
        else if ((size == 2) && (color == 1)) {
            price = 3.9
        }
        else if ((size == 2) && (color == 2)) {
            price = 4.5
        }
        else if ((size == 2) && (color == 3)) {
            price = 28.9
        }
        else if ((size == 2) && (color == 4)) {
            price = 29.9
        } }
    else if((amount > 19) &&(amount <= 49)) {
        if((size == 1) && (color ==1)) {
            price = 1.6
        }
        else if((size == 1) && (color ==2)) {
            price = 2.2
        }
        else if((size == 1) && (color ==3)) {
            price = 8.9
        }
        else if((size == 1) && (color ==4)) {
            price = 9.9
        }
        else if((size == 2) && (color ==1)) {
            price = 3.3
        }
        else if((size == 2) && (color ==2)) {
            price = 4.1
        }
        else if((size == 2) && (color ==3)) {
            price = 17.9
        }
        else if((size == 2) && (color ==4)) {
            price = 19.9
        }
    }
    else if((amount > 49) &&(amount <=99)){
        if((size == 1) && (color ==1)) {
            price = 1.4
        }
        if((size == 1) && (color ==2)) {
            price = 2
        }
        if((size == 1) && (color ==3)) {
            price = 6.9
        }
        if((size == 1) && (color ==4)) {
            price = 8.9
        }
        if((size == 2) && (color ==1)) {
            price = 3
        }
        if((size == 2) && (color ==2)) {
            price = 3.8
        }
        if((size == 2) && (color ==3)) {
            price = 12.9
        }
        if((size == 2) && (color ==4)) {
            price = 15.9
        }
    }
    else if ((amount > 99) && (amount <= 499)) {
        if((size == 1) && (color ==1)) {
            price = 1.2
        }
        if((size == 1) && (color ==2)) {
            price = 1.8
        }
        if((size == 1) && (color ==3)) {
            price = 4.9
        }
        if((size == 1) && (color ==4)) {
            price = 6.9
        }
        if((size == 2) && (color ==1)) {
            price = 2.6
        }
        if((size == 2) && (color ==2)) {
            price = 3.4
        }
        if((size == 2) && (color ==3)) {
            price = 9.9
        }
        if((size == 2) && (color ==4)) {
            price = 12.9
        }
    }
    else if ((amount > 499) && (amount <= 999)) {
        if((size == 1) && (color ==1)) {
            price = 1.1
        }
        if((size == 1) && (color ==2)) {
            price = 1.6
        }
        if((size == 1) && (color ==3)) {
            price = 3.9
        }
        if((size == 1) && (color ==4)) {
            price = 4.9
        }
        if((size == 2) && (color ==1)) {
            price = 2.4
        }
        if((size == 2) && (color ==2)) {
            price = 3.2
        }
        if((size == 2) && (color ==3)) {
            price = 6.9
        }
        if((size == 2) && (color ==4)) {
            price = 7.9
        }
    }
    else if ((amount > 999)) {
        if((size == 1) && (color ==1)) {
            price = 1
        }
        if((size == 1) && (color ==2)) {
            price = 1.5
        }
        if((size == 1) && (color ==3)) {
            price = 2.9
        }
        if((size == 1) && (color ==4)) {
            price = 3.9
        }
        if((size == 2) && (color ==1)) {
            price = 2.2
        }
        if((size == 2) && (color ==2)) {
            price = 2.9
        }
        if((size == 2) && (color ==3)) {
            price = 4.9
        }
        if((size == 2) && (color ==4)) {
            price = 5.9
        }
    }

document.getElementById("vysledek").innerHTML=amount * price;   
}  

解决方法

你可以创建一个这样的对象。 小例子只是为了展示用例:

const amountLt19 = {
  size: {
    1: {
      color: {
        1: 2.5,2: 3,3: 9.9
      }
    }
  }
}

const objSize = amountLt19[size];
const price = objSize && objSize[color]

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。