2016-06-16 8 views
0

Ich baue eine Wetter-App für meine Website mit JavaScript, jQuery, HTML und CSS. Ich bekomme meine Wetterdaten von einer API. Die API hat verschiedene Möglichkeiten für den aktuellen Zustand, wie Regen, Schnee usw. Ich verwende ein Open-Source-Wetter-Icon-Paket, das ich online gefunden habe. Meine Absicht ist es, jedem möglichen Zustand, der von der API an meine App zurückgemeldet werden könnte, ein entsprechendes Icon zuzuordnen. Der Ansatz, für den ich mich entschieden habe, und die Tatsache, dass ich bei der Web- und JavaScript-Entwicklung völlig neu bin, ist vielleicht keine gute Idee, aber ich habe mich entschieden, ein Objekt mit Schlüsselpaaren zu erstellen. Die Schlüssel würden alle möglichen Bedingungen umfassen, während der Wert der Klassenname des entsprechenden HTML-Symbols für diese Bedingung wäre. Hier ist ein Ausschnitt davon, worüber ich spreche.Mehrere Schlüssel mit demselben Wert in JavaScript Objekt

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]); 

Wie Sie sehen können, gibt es mehrere Bedingungen für die ich das gleiche Symbol wird verwendet, so in anderen Worten, es mehr Schlüssel in dem Objekt mit dem gleichen Wert sind. Gibt es eine Möglichkeit, dass ich mehreren Tasten denselben Wert zuweisen kann? Zum Beispiel so etwas wie ...

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

Ich weiß, dass dieses Beispiel nicht funktionieren wird, aber ich benutze es hier nur um zu Visualize, was ich zu tun versuchen. Fürs Erste werde ich jedem einzelnen Schlüssel seinen eigenen Wert geben, auch wenn dieser Wert für mehrere andere Schlüssel der gleiche ist, aber wenn es einen Weg gibt, dies zu optimieren, würde ich es gerne wissen!

Antwort

1

Anstatt diese Daten in einem Objektliteral zu speichern, möchten Sie möglicherweise eine Funktion schreiben, die die Wetterbedingung als Argument akzeptiert und die richtige Klasse zurückgibt. Es kann sogar ein guter Anwendungsfall für eine switch statement sein.

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

Danke, das wie eine bessere Lösung für sicher aussieht! Ich gebe gerade eine Drehung. –

Verwandte Themen