Javascript 如何为下面的函数编写更高效的代码?

Javascript 如何为下面的函数编写更高效的代码?,javascript,Javascript,此功能显示/隐藏根据员工指定选择位置的选择标记。代码我写的作品很好,但我觉得它可以更有效 //according to different designation different set of locations options gets activated function location_served_option_by_designation(filter) { var area_display_setting; var city_dis

此功能显示/隐藏根据员工指定选择位置的选择标记。代码我写的作品很好,但我觉得它可以更有效

//according to different designation different set of locations options gets activated
function location_served_option_by_designation(filter)
    {   
        var area_display_setting;
        var city_display_setting;
        var region_display_setting;
        var zone_display_setting;
        var country_display_setting;
        var location_title;

        switch(filter.value.toLowerCase()){
            case 'bm':
                area_display_setting = 'none';
                city_display_setting = 'flex';
                region_display_setting = 'flex';
                zone_display_setting = 'flex';
                country_display_setting = 'flex';

                location_title = 'area';
                break
            case 'abm':
                area_display_setting = 'none';
                city_display_setting = 'flex';
                region_display_setting = 'flex';
                zone_display_setting = 'flex';
                country_display_setting = 'flex';

                location_title = 'area';
                break
            case 'rsm':
                area_display_setting = 'none';
                city_display_setting = 'none';
                region_display_setting = 'none';
                zone_display_setting = 'flex';
                country_display_setting = 'flex';

                location_title = 'region';
                break
            case 'zsm':
                area_display_setting = 'none';
                city_display_setting = 'none';
                region_display_setting = 'none';
                zone_display_setting = 'none';
                country_display_setting = 'flex';

                location_title = 'zone';
                break
            case 'nsm':
                area_display_setting = 'none';
                city_display_setting = 'none';
                region_display_setting = 'none';
                zone_display_setting = 'none';
                country_display_setting = 'none';

                location_title = 'country';
                break
        }

        location_served_area.style.display = area_display_setting;
        selected_served_area.options[0].selected = 'true';

        location_served_city.style.display = city_display_setting;
        selected_served_city.options[0].selected = 'true';

        location_served_region.style.display = region_display_setting;
        selected_served_region.options[0].selected = 'true';

        location_served_zone.style.display = zone_display_setting;
        selected_served_zone.options[0].selected = 'true';

        location_served_country.style.display = country_display_setting;
        selected_served_country.options[0].selected = 'true';

        location_served_title.innerText = location_title[0].toUpperCase() + location_title.slice(1);
    }
HTML标记的图像|此处选择的名称为“BM”,因此激活国家:印度、地区:中部地区、地区:恰蒂斯加尔和城市:Durg1,并根据城市区域激活以选择员工服务区域。如果名称为“ZSM”,则只有国家/地区选择标签将被激活,并且根据国家/地区选择将显示为复选框。

在这种情况下,如果。。。else语句而不是
开关
,从一开始就给出变量值,并且仅当它们满足我的条件时才更改它们。在我们的例子中,如果过滤器值等于“nsm”,那么这些值保持不变,以便我们可以检查其他情况。在javaScript中,建议对变量名进行区分大小写,并保持名称相当简短和相关。 这是我如何干燥代码的:

function byDesignation(filter) {   
  let filterValue = filter.value.toLowerCase();
  let area = "none";
  let city = "none";
  let region = "none";
  let zone = "none";
  let country = "none";
  let locationTitle = "country";

  if (filterValue === "zsm") {
    country = "flex";
    locationTitle = "zone";
  } else if (filterValue === "rsm") {
    locationTitle = "region";
    zone = "flex";
    country = "flex";
  } else if (filterValue === "abm" || filterValue === "bm") {
    locationTitle = "area";
    city = "flex";
    region = "flex";
    zone = "flex";
    country = "flex";  
  }
  // the rest of the function
  // ...
}

“过早优化是万恶之源”—唐纳德Knuth@Skusku谢谢你的建议,它真的很有帮助。我喜欢另一个类似的版本“让它工作|让它更好|让它更快”。我将尝试遵循您的建议。谢谢您从逻辑上讲,您的代码是正确的。我唯一想建议的是,删除重复性和冗余。将类似的操作移动到单独的函数中。1.用于每次设置选项值的函数。2.用于设置显示设置的函数,只需传递参数。在“bm”情况下:您可以移动:区域显示设置='none';城市显示设置='flex';区域显示设置='flex';区域显示设置='flex';国家显示设置='flex';位置标题='area';中断;“因为下一条语句包含相同的逻辑。对于其余的代码,我不会通过使其更通用来进一步简化,因为这通常会导致代码不可读和不灵活,并且不会加快速度。感谢您的改进。”。