2016-03-27 28 views
1

我想做一个函数,当一个输入在给定的范围内时返回一个特定的字符串。使用案例:我想根据给定城市的温度改变我的网页的颜色。我有一个函数需要一个数字并返回一个颜色变体。但是,它似乎总是返回“粉红色”。任何帮助?无法找到这个JS函数中的错误

function colorTemperature(temperature){ 
     if(temperature <= -10){ 
     colorTemperatureResult = 'midnightblue'; 
     } 
     if(temperature > 0 && temperature <= 10) 
     { 
     colorTemperatureResult = 'darkblue'; 
     } 
     if(temperature > 10 && temperature <= 20) 
     { 
     colorTemperatureResult = 'royalblue'; 
     } 
     if(temperature > 20 && temperature <= 30) 
     { 
     colorTemperatureResult = 'steelblue'; 
     } 
     if(temperature > 30 && temperature <= 40) 
     { 
     colorTemperatureResult = 'deepskyblue'; 
     } 
     if(temperature > 40 && temperature <= 50) 
     { 
     colorTemperatureResult = 'lightblue'; 
     } 
     if(temperature > 50 && temperature <= 60) 
     { 
     colorTemperatureResult = 'lightyellow'; 
     } 
     if(temperature > 60 && temperature <= 70) 
     { 
     colorTemperatureResult = 'lemonchiffron'; 
     } 
     if(temperature > 70 && temperature <= 80) 
     { 
     colorTemperatureResult = 'khaki'; 
     } 
     if(temperature > 80 && temperature <= 90) 
     { 
     colorTemperatureResult = 'orange'; 
     } 
     if(temperature > 90 && temperature <= 100) 
     { 
     colorTemperatureResult = 'gold'; 
     } 
     if(temperature >= 100) 
     { 
     colorTemperatureResult = 'orangered'; 
     } 
     else { 
     colorTemperatureResult = 'pink'; 
     } 
     return colorTemperatureResult; 
    } 

此外,如果有一个更简单的方法来执行此功能没有所有这些条件,请让我知道。我知道输入正确传递,但不能在逻辑出错的地方弄清楚。

谢谢!

+2

您的代码没有解决-9〜0 –

+1

的'else'只绑定如果在它之前有'if',并且只会否定那个条件,所以它具有与'if(temperature <100){colorTemperatureResult ='pink'; }'。在这些之前的'if's可能正常工作,但是'else'接下来并且取代了这个值。 –

回答

4

您的if表达式中没有一个表达式具有else if,以防止在执行过程中不必评估它们。

将您的字符串分配从colorTemperatureResult = 'whatever'更改为return 'whatever',它将工作。

但是你的代码过于复杂,你也可以完全消除>比较:

function colorTemperature(temperature) { 
    if(temperature <= -10) { 
     return 'midnightblue'; 
    } else if(temperature <= 10) { 
     return 'darkblue'; 
    } else if(temperature <= 20) { 
     return 'royalblue'; 
    } else if(temperature <= 30) { 
     return 'steelblue'; 
    } else if(temperature <= 100) { 
    // snip 
    } else if(temperature <= 110) { 
     return 'gold'; 
    } else { 
     return 'orangered' 
    } 
} 
1

else是指最后if声明。只需将除第一个之外的所有if语句切换为else if语句。

+0

感谢您指出了这一点! –

1

我来了2线解决方案给你。检查出来:

function colorTemperature (temperature) { 
    var strings = ['midnightblue', 'darkblue', 'royalblue', 'steelblue', 'deepskyblue', 'lightblue', 'lightyellow', 'lemonchiffron', 'khaki', 'orange', 'gold', 'orangered', 'pink'] 
    return strings[Math.floor(temperature/10) + 1] || 'whatever' 
} 
+0

干得好。我只是想解决'-'范围... –

+0

嘿,谢谢,你说什么意思是范围?用对象来表示它? – nikoloza

0

首先,你创建一个全局colorTemperatureResult 您应该创建一个在功能范围:

function colorTemperature(temperature){ 
    var colorTemperatureResult = ""; 
    ... 

一个简单的方法是改变:

else { 
     colorTemperatureResult = 'pink'; 
     } 

检查一个是否曾被分配过:

colorTemperatureResult = colorTemperatureResult ? colorTemperatureResult : 'pink'; 

你也可以写一个简单的函数:

function between(x, min, max) { 
    return x > min && x <= max; 
} 

,并使用它:

if(between(temperature,0,10)) {colorTemperatureResult = 'darkblue';} 
... 

编辑:您也可以使从范围的一个通用的列表和进程:

var tempMap = { 
    default: 'pink', 
    ranges: [{ 
    min: -10, 
    max: 0, 
    color: 'midnightblue' 
    }, { 
    min: 0, 
    max: 10, 
    color: 'darkblue' 
    }, { 
    min: 10, 
    max: 20, 
    color: 'royalblue' 
    }, { 
    min: 20, 
    max: 30, 
    color: 'steelblue' 
    }, { 
    min: 30, 
    max: 40, 
    color: 'deepskyblue' 
    }, { 
    min: 40, 
    max: 50, 
    color: 'lightblue' 
    }, { 
    min: 50, 
    max: 60, 
    color: 'lightyellow' 
    }, { 
    min: 60, 
    max: 70, 
    color: 'lemonchiffron' 
    }, { 
    min: 70, 
    max: 80, 
    color: 'khaki' 
    }, { 
    min: 80, 
    max: 90, 
    color: 'orange' 
    }, { 
    min: 90, 
    max: 100, 
    color: 'gold' 
    }, { 
    min: 100, 
    max: 110, 
    color: 'orangered' 
    }] 
}; 

function between(x, min, max) { 
    return x > min && x <= max; 
} 

function colorTemperature(temperature) { 
    var colorTemperatureResult = ""; 
    // its really cold out there 
    if (temperature < tempMap.ranges[0].min) colorTemperatureResult = tempMap.ranges[0].color; 
    else 
    for (var i = 0; i < tempMap.ranges.length; i++) { 
     if (between(temperature, tempMap.ranges[i].min, tempMap.ranges[i].max)) { 
     colorTemperatureResult = tempMap.ranges[i].color; 
     break; 
     } 
    } 
    colorTemperatureResult = colorTemperatureResult ? colorTemperatureResult : tempMap.default; 
    return colorTemperatureResult; 
} 
0

要回答第二个问题,这将是一个更简单的方法,而kee ping温度范围的概念。更新颜色/临时表的列表也会更容易。你可以变出任何你想要的范围分隔符(正斜杠):

var tempColorMap = { 
    '-10/0' : 'midnightblue', 
    '1/10' : 'darkblue', 
    '11/20' : 'royalblue', 
    '21/30' : 'steelblue', 
    '31/40' : 'deepskyblue', 
    '41/50' : 'lightblue', 
    '51/60' : 'lightyellow', 
    '61/70' : 'lemonchiffron', 
    '71/80' : 'khaki', 
    '81/90' : 'orange', 
    '91/100' : 'gold', 
    '101/500': 'orangered' 
}; 

function getColorByTemp(temp) { 
    var color = 'pink'; 

    for (var range in tempColorMap) { 
     var rangeSplit = range.split('/'); 
     var min  = rangeSplit[0]; 
     var max  = rangeSplit[1]; 

     if (temp >= min && temp <= max) { 
      color = tempColorMap[range]; 
      break; 
     } 
    } 

    return color; 
} 

编辑:情况错字

相关问题