Преобразование оператора if для переключения оператора - PullRequest
1 голос
/ 26 сентября 2019

Мне нужно преобразовать оператор 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>

Ответы [ 2 ]

2 голосов
/ 26 сентября 2019

Я процитирую Дугласа Крокфорда из: Javascript хороших частей

Заявление о переключении является компетентной функцией.Как и большинство компетентных функций, у него множество проблем с ним - требование использовать разрыв после каждого оператора в пределах дела, процедурный поток управления, синтаксис вне места, обработка блоков кода и многое другое!К сожалению, решение этих проблем потребовало бы от нас переписать принцип работы ядра, и спецификация полностью изменилась бы, что для такого языка, как JavaScript, привело бы к серьезным проблемам обратной совместимости.

Итог:Придерживайтесь утверждений if / else if / else.

0 голосов
/ 26 сентября 2019

Я смог понять это.Я понял, что я поставил «case default» вместо «default».Мне пришлось включить часть кода по умолчанию для случая 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++;
...