有人可以告诉我如何简化此代码吗？

html5 • • 问答

在实践中，我有这个代码，如果有办法让它更容易，那么做所有这些似乎很累人？但它工作正常吗？因为这段代码不仅有 *（乘法）它还有 3 /（除法）。如果它只有乘法，那么它很容易做到，但它也有那些除法，所以这样做会变得更加困难。如果有人可以帮助我谢谢。

        function calculateLength() {
        
        
        
            var lengthinput = parseFloat(document.getElementById('lengthinput').value);


            var oper = document.getElementById('lengthselector1').value;
            var oper2 = document.getElementById('lengthselector2').value;


            if(oper === 'k' && oper2 === 'm')
            {
                document.getElementById('lengthresult').value = lengthinput*1000 || 0;
            }

            
            if(oper === 'k' && oper2 === 'd')
            {
                document.getElementById('lengthresult').value = lengthinput*10000 || 0;
            }

            if(oper === 'k' && oper2 === 'c')
            {
                document.getElementById('lengthresult').value = lengthinput*100000 || 0;
            }
            
            if(oper === 'k' && oper2 === 'mi')
            {
                document.getElementById('lengthresult').value = lengthinput*1000000 || 0;
            }

            if(oper === 'k' && oper2 === 'mic')
            {
                document.getElementById('lengthresult').value = lengthinput*1.0000E+9 || 0;
            }               
            
            if(oper === 'k' && oper2 === 'de')
            {
                document.getElementById('lengthresult').value = lengthinput*100 || 0;
            }

            if(oper === 'k' && oper2 === 'h')
            {
                document.getElementById('lengthresult').value = lengthinput*10 || 0;
            }   

            if(oper === 'k' && oper2 === 'me')
            {
                document.getElementById('lengthresult').value = lengthinput/1000 || 0;
            }
            
            if(oper === 'k' && oper2 === 'g')
            {
                document.getElementById('lengthresult').value = lengthinput/1000000 || 0;
            }

            if(oper === 'k' && oper2 === 'z')
            {
                document.getElementById('lengthresult').value = lengthinput/1.0000E+18 || 0;
            }               
            
            if(oper === 'k' && oper2 === 'i')
            {
                document.getElementById('lengthresult').value = lengthinput*39370.0787 || 0;
            }

            if(oper === 'k' && oper2 === 'a')
            {
                document.getElementById('lengthresult').value = lengthinput*1.0000E+13 || 0;
            }           
                            

        }

回答

您的所有if条件都测试oper==='k'，因此它可以成为if围绕所有其他条件的一个陈述。为了oper2使查找表：

function calculateLength() {
    var lengthinput = parseFloat(document.getElementById('lengthinput').value);
    var oper = document.getElementById('lengthselector1').value;
    if (oper === 'k') {
        var oper2 = document.getElementById('lengthselector2').value;
        var coefficient = {
            'i': 39370.0787,
            'z': 1e-18,
            'g': 1e-6,
            'me': 1e-3,
            'h': 10,
            'de': 100,
            'm': 1e3,
            'd': 1e4,
            'c': 1e5,
            'mi': 1e6,
            'mic': 1e9,
            'a': 1e13
        }[oper2]; // <-- here we perform the lookup
        if (coefficient) {
            document.getElementById('lengthresult').value = lengthinput*coefficient || 0;
        }
    }
}

请注意，1.0000E+9在您的代码中等于1e9. 额外的十进制零不会改变任何东西，+指数部分中的也不会改变。

在某些情况下，您的代码使用标准记数法，例如 1000000，也可以用科学记数法编写：1e6。我会尝试对 10 的所有幂使用相同的表示法，这样您就可以更清楚地看到不同系数的比较情况。

此外，除以10 的幂与乘以10 的幂相同，其中指数为负：例如：

length/1e18 === length*1e-18

这意味着您可以将所有这些系数写为multipliers，并使用科学记数法（不规则的 39370.0787 除外，您可以选择保留标准记数法）。

只是为了比较，您可以编写没有科学计数法的查找表（“映射对象”），如下所示：

    var coefficient = {
        'i': 39370.0787,
        'z': 0.000000000000000001,
        'g': 0.000001,
        'me': 0.001,
        'h': 10,
        'de': 100,
        'm': 1000,
        'd': 10000,
        'c': 100000,
        'mi': 1000000,
        'mic': 1000000000,
        'a': 10000000000000
    }[oper2]; // <-- here we perform the lookup

以上是有人可以告诉我如何简化此代码吗？的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>