javascript - 是否可以使用对象而不是 Switch 语句？

Question

我经常在我的代码中使用 switch 语句，我读到了这个对象，很多开发人员说它更好用。我想使用更少的代码，你们知道使这段代码更高效的替代方法吗？

完整的代码链接在这里 - https://jsfiddle.net/lmanhaes/5ebjypo1/

我在下面分享了两个我想更改的示例。

非常感谢。

//fisrt example
$(document).ready(function () {

    $("#country").change(function () {
        var cityName;
        var select = $("#country option:selected").val(); 
        switch (select) {
            case "England":
                cityName = "england";
                city(cityName);
                break;
            case "Scotland":
                cityName = "scotland";
                city(cityName);
                break;
            case "Wales":
                cityName = "wales";
                city(cityName);
                break;
            case "Northern Ireland":
                cityName = "nireland";
                city(cityName);
                break;
            default:
                $("#city").empty();

                break;
        }
    });

    $("#city").change(function () { 
        var cityValue = $("#city").val();
        getWeatherApi(cityValue);
    });
    
 //second example
    
    $.each(response.weather, function (index, value) {  
                    cond = response.weather[index].main;

                    

                    switch (cond) { 
                        case "Clouds":
                            icon = '<img src="./weather_icons/cloud.png" alt="cloud" width="70px" height="80%"/>';
                            break;
                        case "Hail":
                            icon = '<img src="./weather_icons/hail.png" alt="hail" width="70px" height="80%"/>';
                            break;
                        case "Heavy Cloud":
                            icon = '<img src="./weather_icons/heavy cloud.png" alt="heavy-clouds" width="70px" height="80%"/>';
                            break;
                        case "Heavy Rain":
                            icon = '<img src="./weather_icons/heavy rain.png" alt="heavy-rain" width="70px" height="80%"/>';
                            break;
                        case "Rain":
                            icon = '<img src="./weather_icons/rain.png" alt="rain" width="70px" height="80%"/>';
                            break;
                        case "Sleet":
                            icon = '<img src="./weather_icons/sleet.png" alt="sleet" 70px" height="80%"/>';
                            break;
                        case "Snow":
                            icon = '<img src="./weather_icons/snow.png" alt="snow" width="70px" height="80%"/>';
                            break;
                        case "Sun":
                            icon = '<img src="./weather_icons/sun.png" alt="sun" 70px" height="80%"/>';
                            break;
                        case "Sun and Clouds":
                            icon = '<img src="./weather_icons/sun and cloud.png" alt="sun-cloud" width="70px" height="80%"/>';
                            break
                        case "Thunderstorm":
                            icon = '<img src="./weather_icons/thunderstorm.png" alt="thunderstorm" width="70px" height="80%"/>';
                            break;
                        default: 
                            icon = '';
                            break;
                    }
                });

标签： javascriptjsonobjectswitch-statementjavascript-objects

Answer 1

对象和 switch-case 块之间有太多的主要区别。对象是安全数据的数据结构，开关块是缩短 if-else 结构的句法结构。对于内存和 cpu 性能，请使用 switch-case 语句。

为了更好地概述代码：在您的案例块中查找重复项。您还可以在自己的函数中外包您的 switch 语句。有关更多概述，请使用干净的功能名称并将此类功能外包给模块。

例如：

$(document).ready(function () {

    $("#country").change(function () {
        var cityName;
        var select = $("#country option:selected").val(); 
        var convertedCityName = convertCityNames(select);
        if(convertedCityName) {
            city(convertCityNames);
        } else {
            $("#city").empty();
        }
    });

    function convertCityNames(inputedCityName) {
        switch (inputedCityName) {
            case "England":
                return "england";
            case "Scotland":
                return "scotland";
            case "Wales":
                return "wales";
            case "Northern Ireland":
                return "nireland";
            default:
                return;
        }
    }