第一个现实生活-工作JS脚本.我怎样才能使它更有效率

First Real Life - Working JS Script. How can I make it more efficient?

本文关键字:有效率 生活 工作 脚本 JS 第一个      更新时间:2023-09-26

在过去的几周里,我开始学习Javascript。我已经阅读了《头优先的Javascript编程》这本书的大部分内容,它非常棒。我强烈推荐它!

无论如何,我找到了一个很酷的小项目,我想尝试为其制作脚本。经过几个小时的学习、添加和bug消除,我有了一个工作脚本。

我的问题是(因为我是JS的新手),我能让这件事变得更简单吗?有什么是我错过的或经过很长一段时间才找到的吗?

从这里开始,我如何在对象中获得值,然后根据当前脚本查找对象?这可能吗?或者我需要一个"Unit"answers"M3"的数组吗?

之后的下一步是让它连接到XML或JSON文档,并从中检索值,同时对每个字段进行错误检查。

谢谢!

气流计算器:

测试值:

面积:150

天花板高度:2.7

调整系数:1

单位:D095

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>
//Air Changes Calculator
function init() {
    // Set the User Variables
    var unit = ["D095", "D125", "D160", "D195", "D230", "D255", "C125", "C160", "C205", "C240"];
    var m3 = [7500, 10000, 12500, 15000, 18000, 19500, 10000, 12500, 16000, 18500];
    var webPrint = document.getElementById("output");
    var reccommended = document.getElementById("reccommended");
    var floorArea = document.getElementById("floorarea").value;
    var ceilingHeight = document.getElementById("ceilingheight").value;
    var adjustmentFactor = document.getElementById("adjustment").value;
    var unitAir;
    var volume = floorArea * ceilingHeight;
    var adjustedVolume = volume * adjustmentFactor;
    var unitSelection = document.getElementById("model").value;

    for (var i = 0; i < unit.length; i++) {
        if (unit[i] === unitSelection) {
            unitAir = m3[i];
        }
    }
    var calc = unitAir / adjustedVolume;
    webPrint.innerHTML = "For a " + floorArea + " m2 area, The "
    + unitSelection + " will provide " + Math.round(calc) + " air changes.";
// Function 2 - Get any unit that provides between 30 - 40 air changes for that area and adjustment factor
    var firstResult = 0
    for (var i = 0; i < unit.length; i++) {
        var suggestResult = m3[i] / adjustedVolume;
//      console.log(i);
        if ((suggestResult > 30 && suggestResult < 40 && firstResult == 0)) {
            var text;
            text = "We can also reccommend the " + unit[i] + " as it will give " + Math.round(suggestResult) + " air changes <br/>";
            document.getElementById("reccommended").innerHTML = text;
//          console.log("We are inside the TRUE");
            firstResult++
        } else if ((suggestResult > 30 && suggestResult < 40)) {
            var text;
            text += "We can also reccommend the " + unit[i] + " as it will give " + Math.round(suggestResult) + " air changes <br/>";
//          console.log("We are inside the FALSE");
        }
//console.log("This is the Result: " + firstResult);
    }
    document.getElementById("reccommended").innerHTML = text;
}
</script>
</head>
<body>
<form>
Enter Floor Area: <input type="text" name="floorarea" id="floorarea"></br></br>
Enter Ceiling Height: <input type="text" name="ceilingheight" id="ceilingheight"></br></br>
Enter Adjustment Factor (Min 1): <input type="text" name="adjustment" id="adjustment"></br></br>
Enter Unit Model: <input type="text" name="model" id="model"></br></br>
<input type="button" value="Submit" onclick="init()">
</form>
<p id="output"></p>
<h2>Recommended Units:</h2>
    <p id="reccommended"></p>
</body>
</html>

同意的问题不属于此处

但为了帮你一点

首先-拆分html和Java脚本-将Java脚本移动到自己的文件中并在中引用。我还会在适当的时候将init()方法分解成更小的方法。

如果您计划开发一个更大的应用程序,以避免方法名称之间的混淆,那么您可以开始研究Java脚本的名称间距。

比如:

var app = 
{
    init:function()
    {
     // code goes here
    }
}

然后调用这样的方法:app.init();