2016-06-16 2 views
0

Я создаю приложение погоды для своего сайта, используя JavaScript, jQuery, html и css. Я получаю данные о погоде от api. У api есть несколько различных возможностей для текущего состояния, таких как дождь, снег и т. Д. Я использую открытый значок погоды, который я нашел в Интернете. Мое намерение - связать соответствующий значок с каждым возможным условием, которое можно было бы вернуть обратно в мое приложение из api. Подход, который я решил, и помните о том, что я совершенно новичок в разработке веб-сайтов и JavaScript, поэтому это может быть даже не очень хорошая идея, но я решил создать объект с парами ключевых значений. Ключи будут состоять из всех потенциальных условий, а значением будет имя класса соответствующего значка html для этого условия. Вот фрагмент того, о чем я говорю.Несколько ключей с одинаковым значением в JavaScript-объекте

var condition = data.current.weather; //value coming from API 

var allConditions = { 
    Light Drizzle: 'wi wi-showers', 
    Heavy Drizzle: 'wi wi-showers', 
    Drizzle: 'wi wi-showers', 
    Light Rain: 'wi wi-rain', 
    Heavy Rain: 'wi wi-rain', 
    Rain: 'wi wi-rain', 
    Light Snow: 'wi wi-snow', 
    Heavy Snow: 'wi wi-snow', 
    Snow: 'wi wi-snow', 
    Light Snow Grains: 'wi wi-snow' 
} 

$('#icon').addClass(allConditions[currentCondition]); 

Как вы можете видеть, есть несколько условий, для которых я буду использовать тот же значок, так и в других словах, есть несколько ключей в объекте с тем же значением. Есть ли способ, которым я могу присвоить одно и то же значение нескольким клавишам? Например, что-то вроде ...

var allConditions = { 
    'Light Drizzle, Heavy Drizzle, 
    Light Rain , Heavy Rain' : 'wi wi-showers', 
    'Light Snow, Heavy Snow' : 'wi wi-snow' 
} 

Я знаю, что этот пример не будет работать, но я использую его здесь просто visulize, что я пытаюсь сделать. На данный момент я просто дам каждому ключу свою ценность, даже если это значение будет одинаковым для нескольких других ключей, но если есть способ оптимизировать это, я хотел бы узнать об этом!

ответ

1

Вместо того, чтобы хранить эти данные в объектном литерале, вы можете написать функцию, которая принимает погодное условие в качестве аргумента и возвращает соответствующий класс. Это может быть хорошим вариантом использования для switch statement.

function conditionToClass(condition) { 
    var className = 'wi wi-'; 

    switch (condition) { 
    case 'Drizzle': 
    case 'Light Drizzle': 
    case 'Heavy Drizzle': 
     return className + 'showers'; 
    case 'Rain': 
    case 'Light Rain': 
    case 'Heavy Rain': 
     return className + 'rain'; 
    case 'Snow': 
    case 'Light Snow': 
    case 'Heavy Snow': 
    case 'Light Snow Grains': 
     return className + 'snow'; 
    default: 
     return 'some-default-class'; 
    } 
} 

var weatherClass = conditionToClass(data.current.weather); 

$('#icon').addClass(weatherClass); 
+0

Спасибо, это выглядит как лучшее решение наверняка! Сейчас я прячу его. –

Смежные вопросы