就是不想用if
好久没写代码了。最近一个POC项目的需求,找到指定产品的类型,显示对应的名称。理论上一个产品只有一种类型,如果遇到数据问题,一个产品有多种类型显示任一种就好。
最简单最直白的实现。因为if的存在,复杂度也最高。
1 var discontinuedProduct = ['10002', '1011', '01014']; 2 var overStockProduct = ['10003', '1010', '01013']; 3 var eolProduct = ['10004', '1009', '01012']; 4 5 if (discontinuedProduct.includes(sku)) document.getElementsByClassName('distressed-text')[0].innerText = 'Discontinued'; 6 if (discontinuedProduct.includes(sku)) document.getElementsByClassName('distressed-text')[0].innerText = 'OverStock'; 7 if (discontinuedProduct.includes(sku)) document.getElementsByClassName('distressed-text')[0].innerText = 'End of Life';
把if语句改成或运算,看起来清爽多了。因为短路计算,只有产品没有类型的时候才会判断三次。
1 var distressedTexts = ['', 'Discontinued', 'OverStock', 'End of Life']; 2 var textIndex = eolProdoct.includes(sku) * 3 || overStockProduct.includes(sku) * 2 || discontinuedProduct.includes(sku) * 1 || 0 3 4 document.getElementsByClassName('distressed-text')[0].innerText = distressedTexts[textIndex];
改用数据驱动的方式,把判断转移到findIndex方法中去,代码更简单了。
1 var distressedProducts = [ 2 ['10002', '1011', '01014'], //discontinued product 3 ['10003', '1010', '01013'], //overStock product 4 ['10004', '1009', '01012'] //eol product 5 ]; 6 var distressedTexts = ['', 'Discontinued', 'OverStock', 'End of Life']; 7 8 var distressedType = distressedProducts.findIndex(item => item.includes(sku)); 9 document.getElementsByClassName('distressed-text')[0].innerText = distressedTexts[distressedType + 1];