在打字稿中编写此开关/案例的更好方法？

Question

我正在 Angular 中开发一个非常简单的天气应用程序，我想问你是否认为有更好的方法可以根据天气条件的“类型”选择某个图像。enum WeatherCodition {    Thunderstorm = 0,    Drizzle,    Rain,    Snow,    Clear,    Clouds}export class Weather {    getIcon(condition: WeatherCodition): string {        var iconPath = "";        switch(condition){            case WeatherCodition.Thunderstorm:                iconPath =  "thunderstorm.png";                break;            case WeatherCodition.Clouds:                iconPath =  "clouds.png";                 break;            case WeatherCodition.Drizzle:                iconPath =  "drizzle.png";                break;            case WeatherCodition.Rain:                iconPath =  "rain.png";                 break;            case WeatherCodition.Snow:                iconPath =  "snow.png";                break;            default:                iconPath = "clear.png"        }        return iconPath;    }}

Answer 1

请考虑使用interface KeyValue<K, V>作为数组。我的解决方案：

export enum WeatherCodition {

    Thunderstorm = 0,

    Drizzle,

    Rain,

    Snow,

    Clear,

    Clouds

}

import { KeyValue } from '@angular/common';

export class Weather {

    public keyValueArray: KeyValue<WeatherCodition, string>[] = 

    [

        { key: WeatherCodition.Thunderstorm, value: "thunderstorm.png" },

        { key: WeatherCodition.Drizzle , value: "drizzle.png"},

        { key: WeatherCodition.Rain, value: "rain.png" },

        { key: WeatherCodition.Snow, value: "snow.png" },

        { key: WeatherCodition.Clear, value: "clear.png" },

        { key: WeatherCodition.Clouds, value: "clouds.png" },

    ];

    getIcon(condition: WeatherCodition): string {

        //check if 'condition' exists in array as key

        return this.keyValueArray[condition] ? 

            this.keyValueArray[condition].value : 

            "clear.png"; 

    }

}

祝你今天过得愉快！

Answer 2

您可以根据键创建对象和访问属性

let WeatherCodition = {

  thunderstorm:"thunderstorm.png",

  clouds:"clouds.png",

  drizzle:"drizzle.png",

  rain:"rain.png",

  snow:"snow.png",

  default:"clear.png"

}

function getIcon(condition) {

  condition = condition || ""

  condition = Object.keys(WeatherCodition).find(c=> c.toLowerCase() === condition.toLowerCase()) || 'default'

  return WeatherCodition[condition]

}

console.log(getIcon(''))

console.log(getIcon('Clouds'))

console.log(getIcon())

console.log(getIcon('SnoW'))