Question

我需要将函数中的if语句转换为switch语句以进行赋值。该功能需要做的是，当用户按下“提交”按钮时，将用户输入的内容显示为列表项。当输入数量等于5时，它会显示“谢谢您的建议”。

我将原始的if语句作为注释。

我不确定从何处去，因此它的作用与if语句相同。

    <article>
        <div id="results">
            <ul>
                <li id="item1"></li>
                <li id="item2"></li>
                <li id="item3"></li>
                <li id="item4"></li>
                <li id="item5"></li>
            </ul>
            <p id="resultsExpl"></p>
        </div>
        <form>
            <fieldset>
                <label for="toolBox" id="placeLabel">
                    Type the name of a tool, then click Submit:
                </label>
                <input type="text" id="toolBox" />
            </fieldset>
            <fieldset>
                <button type="button" id="button">Submit</button>
            </fieldset>
        </form>
    </article>
    <script>
        // global variables
        var i=1;
        var listItem = "";
        // function to add input to list
        function processInput() 
        {
            /*
            if (i<=5) 
            {
                listItem = "item" + i;
                document.getElementById(listItem).innerHTML = document.getElementById("toolBox").value;
                document.getElementById("toolBox").value = "";
                if (i==5) 
                {
                    document.getElementById("resultsExpl").innerHTML = "Thanks for your suggestions.";
                }
                i++;
            }
            */
            switch (i) {
                case 5:
                    document.getElementById("resultsExpl").innerHTML = "Thanks for your suggestions.";
                    break;
                case default:
                    listItem = "item" + i;
                    document.getElementById(listItem).innerHTML = document.getElementById("toolBox").value;
                    document.getElementById("toolBox").value = "";
                    i++;
            }
        }
        // adds backward compatible event listener to Submit button
        var submitButton = document.getElementById("button");
        if (submitButton.addEventListener) {
            submitButton.addEventListener("click", processInput, false);
        } else if (submitButton.attachEvent) {
            submitButton.attachEvent("onclick", processInput);
        }
    </script>

Answer 1

我将引用Javascript the good parts的道格拉斯·克罗克福德

switch语句是一个主管功能。像最胜任的功能，它有很多问题-使用要求在案例中的每条陈述之后，程序控制流，不合适的语法，代码块的处理等等！不幸的是，解决这些问题将需要我们重写它在核心运行，并且规格将完全改变，这对于 JavaScript之类的语言会造成大量倒退兼容性问题。

底线：坚持使用if / else if / else语句。

Answer 2

我能够弄清楚。我意识到我把“案例默认”而不是“默认”。我必须包括一些从默认到案例5的代码，以便它显示最后的输入以及消息。我还将i ++放在switch语句之外，以便它在第5次迭代后停止，但不替换最后一个输入。

switch (i) {
    case 5:
        listItem = "item" + i;
        document.getElementById(listItem).innerHTML = document.getElementById("toolBox").value;
        document.getElementById("toolBox").value = "";
        document.getElementById("resultsExpl").innerHTML = "Thanks for your suggestions.";
        break;
    default:
        listItem = "item" + i;
        document.getElementById(listItem).innerHTML = document.getElementById("toolBox").value;
        document.getElementById("toolBox").value = "";
}
i++;

将if语句转换为switch语句

2 个答案: