Question

我正在编写与GUI窗口交互的JavaScript脚本。用最基本的术语来说，我定义对象并编写函数以与这些对象进行交互。我的标准做法是为窗口中的每个字段创建一个对象，然后为一个要交互的函数和一个要验证的函数。

例如，如果我有一个这样的窗口：

我有一个对象用于字段1的下拉菜单，另一个用于文本框。与字段2相同。我还要为“完成”按钮设置一个对象。然后，我将具有一个功能，用于从字段＃1的下拉列表中进行选择，将文本输入文本对象，单击完成按钮等。这是一种简化，但是主要思想。我们为一般的窗口布局使用一个类，然后为每个单独的窗口使用子类，但是它们基本上都以这种方式工作。

好的，所以我有一个窗口正在尝试创建快捷方式功能，我想从下拉菜单中选择一个选项，具体取决于文本框中的文本是否尚未设置。这很容易检查，因为只有两个选项“是”和“否”。

所以我有一段冗长的代码可以进行简单的操作：

function toggleOption(option)
{
    //Simplistic check to see that users are only using Yes or No
    if (option.length > 3)
    {
        test.fatal("FATAL: \"" + option + "\" is not a valid input. Please use a variant of \"Yes\" or \"No\"");
    }
    
    //Allows for multiple variants of yes/no to be used in the option parameter
    option = option.substring(0,1).toUpperCase();
    var text;
    

    //Defines a text variable depending on what option is used 
    if (option === "Y")
    {
        text = option + " - Yes";
    }
    else
    {
        text = option + " - No";
    }
    

    // Opens the window if not already open
    if (!object.exists(names.Window))
    {
        openWindow();
    }
    

    // There are two fields that will be selected
    // Only selects the option if the text box is set to a different option.
    if (waitForObjectExists(names.TextBox1).text !== text)
    {
        selectField1(option);
        clickDoneButton();
    }
    
    // Only selects the option if the text box is set to a different option.
    if (waitForObjectExists(names.TextBox2).text !== text)
    {
        selectField2(option);
        clickDoneButton();
    }
    

    //The assumption is that this is going to take care of closing the window (which automatically closes when done is clicked) if none of the options are selected.
    if (object.exists(names.Window))
    {
        closeWindow();
    }
}

因此，这段代码都能正常工作，但是对于一些本来应该很简单的事情而言，却似乎令人费解地and肿和and肿。我想知道是否有人对我可以用来简化和提高效率的方法有任何见识。

注意：我用通用名称替换了实际的对象名称，以期使代码更易读。对不起，如果我错过任何文本更改。

Answer 1

好吧，您可以使用 ternary computing ：

    if (option === "Y")
    {
        text = option + " - Yes";
    }
    else
    {
        text = option + " - No";
    }

转到：

    text = option  + ((option === "Y") ? " - Yes" : " - No" );

您还可以在ES6中创建 generic arrow function 来封装option和text：

    // There are two fields that will be selected
    // Only selects the option if the text box is set to a different option.
    if (waitForObjectExists(names.TextBox1).text !== text)
    {
        selectField1(option);
        clickDoneButton();
    }
    
    // Only selects the option if the text box is set to a different option.
    if (waitForObjectExists(names.TextBox2).text !== text)
    {
        selectField2(option);
        clickDoneButton();
    }

类似这样的东西：

const clickButton = (selectFunc, nameTextBox) => {
    // I use closure here to encapsulate 'option' and 'text'
    if (waitForObjectExists(nameTextBox).text !== text){
        selectFunc(option);
        clickDoneButton();
    }
}

及其用法：

clickButton(selectField1, names.TextBox1)
clickButton(selectField2, names.TextBox2)

干杯！：-）

有什么方法可以简化此JavaScript函数？

1 个答案: