如何減少if-else語句

是否有其他方法可以減少if-else語句？該代碼將通過從數據庫獲取整數來更改圖片。我試着減少這段代碼。如何減少if-else語句

if (val["soil_h"] < 21){ 
     $("#ground").attr('src', 'pic/ground1.png'); 
    } else if (val["soil_h"] < 42){ 
     $("#ground").attr('src', 'pic/ground2.png'); 
    } else if (val["soil_h"] < 63){ 
     $("#ground").attr('src', 'pic/ground3.png'); 
    } else if (val["soil_h"] < 84){ 
     $("#ground").attr('src', 'pic/ground4.png'); 
    } else if (val["soil_h"] < 105){ 
     $("#ground").attr('src', 'pic/ground5.png'); 
    } else if (val["soil_h"] < 126){ 
     $("#ground").attr('src', 'pic/ground6.png'); 
    } else if (val["soil_h"] < 147){ 
     $("#ground").attr('src', 'pic/ground7.png'); 
    } else { 
     $("$ground").attr('src', 'pic/ground8.png'); 
    }

來源

2016-03-01 Papa.John

使用開關：https：//developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch –

@ZakariaAcharki但你不能使用範圍值爲'case'的語句... –

var v = [21,42,63,84,105,126,147]; var count = 1; （v）中的val [「soil_h」] { if（val） count ++; } else {（「＃ground」）。attr（'src'，'pic/ground'+ count +'。png'）; } – RRR

使用/（師）的所有值都多的21

試試這個：

想到的

var value=val["soil_h"]/21; 
$("#ground").attr('src', 'pic/ground"'+(value % 1 === 0 ? value : 8)+'".png'); //If value is not multiple of 21, default image is set..

來源

2016-03-01 11:48:38 Rayon

一種方法是鏈三元運營商：

var soil = val["soil_h"]; 

var imagePath = 
    soil < 21 ? 'pic/ground1.png' : 
    soil < 42 ? 'pic/ground2.png' : 
    soil < 63 ? 'pic/ground3.png' : 
    soil < 84 ? 'pic/ground4.png' : 
    soil < 105 ? 'pic/ground5.png' : 
    soil < 126 ? 'pic/ground6.png' : 
    soil < 147 ? 'pic/ground7.png' : 
       'pic/ground8.png'; 

$("#ground").attr('src', imagePath);

來源

2016-03-01 11:48:58

選擇器可能應該是'$（「＃ground」）'而不是'$（「$ ground」）' –

@mef固定，謝謝。 –

感謝您的建議@Dmytro Shevchenko –

var val = { 
 
    soil_h: 43 
 
}; 
 

 
var pics = [ 
 
    { url: 'pic/ground1.png', maxHeight: 21 }, 
 
    { url: 'pic/ground2.png', maxHeight: 42 }, 
 
    { url: 'pic/ground3.png', maxHeight: 63 }, 
 
    { url: 'pic/ground4.png', maxHeight: 84 }, 
 
    { url: 'pic/ground5.png', maxHeight: 105 }, 
 
    { url: 'pic/ground6.png', maxHeight: 126 }, 
 
    { url: 'pic/ground7.png', maxHeight: 147 }, 
 
    { url: 'pic/ground8.png', maxHeight: Number.MAX_VALUE }, 
 
]; 
 

 
$("#ground").attr('src', pics.find(function(pic) { 
 
    return val["soil_h"] < pic.maxHeight; 
 
}).url);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img id="ground" />

來源

2016-03-01 11:49:27

['Array.prototype.find（）']（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Browser_compatibility ）的兼容性有限 – Andreas

它是一個簡單的數學，你不需要編寫太多的代碼。看下面我的回答 – zakaiter

感謝您的建議@Bob海綿和每個人。 –

尋找靠近你的代碼，我想象它只有21多所以這是我寫的假設VAL [「soil_h」]總是一個數字。

簡單的數學計算

 var x = parseInt(val["soil_h"]/21); 
     if(x==0){ 
     x=1; 
     }else if(x>8){ 
     x=8; 
     } 


     $("#ground").attr('src', 'pic/ground'+x+'.png');

來源

2016-03-01 11:59:58 zakaiter

謝謝您的建議@zakaiter –

使用switch另一種可能性：

var imageName 
    , soil = val["soil_h"] 

switch(true) { 
    case soil < 21: 
     imageName = 'ground1.png' 
     break 
    case soil < 42: 
     imageName = 'ground2.png' 
     break 
    case soil < 63: 
     imageName = 'ground3.png' 
     break 
    case soil < 84: 
     imageName = 'ground4.png' 
     break 
    case soil < 105: 
     imageName = 'ground5.png' 
     break 
    case soil < 126: 
     imageName = 'ground6.png' 
     break 
    case soil < 147: 
     imageName = 'ground7.png' 
     break 
    default: 
     imageName = 'ground8.png' 
     break 
} 

$('#ground').attr('src', 'pic/' + imageName)

P.S.請注意，您共享的代碼中最後一條語句的選擇器看起來不正確：應該可能是$("#ground")而不是$("$ground")

來源

2016-03-01 12:14:24

謝謝您的建議@ mef –

如何減少if-else語句

回答

相關問題