在實習過程中灵莲,發(fā)現(xiàn)有些需求就是要進行多種不同情況的判斷,但是寫了太多的if...else...令代碼看起來很不友好殴俱,那么應該怎么去減少那些循環(huán)嵌套呢政冻?
代碼簡潔可以讓后期維護成本低很多!O哂明场!
-
下面這種情況的代碼
if(a為真){ a=a }else{ a=b }
我們可以用下面的代碼來輕松解決
a = a || b
-
進階一點的,看一下下面這種情況
if(a==b){ a=c }else{ a=d }
我們可以用三元判斷來進行簡寫李丰,開發(fā)的時候真的超好用~
a=(a==b)?c:d
3.后臺接口通常會返回這種數(shù)據(jù):
task: 0 // 0=緊急苦锨,1=日常,2=臨時
這個時候肯定不能用判斷芭棵凇舟舒!
用啥?
var _task = ['緊急','日常','臨時'];
task_type = _task[task]
最后希望大家?guī)讉€建議:
- 優(yōu)化if邏輯
把最可能出現(xiàn)的情況放在最前面嗜憔,最不可能出現(xiàn)的情況放在最后面秃励,
-
使用Array的方法或者Map等數(shù)據(jù)結構
比如說:function test(){ if(fruit == 'apple' || fruit == 'strawberry'){ console.log('red'); } }
但是我們需要匹配更多的紅色的水果呢?我們總不能 || 到尾吧
這個時候我們就可以使用Array.includes來重寫上面的條件語句了
function test(fruit){
const redFruit = ['apple','strawberry','cherry','cranberry'];
if(redFruit.includes(fruit)){
console.log('red');
}
}
如果我們有更多水果顏色呢痹筛?
const fruitColor1 = new Map();
fruitColor1.set('red',['apple','strawberry']);
fruitColor1.set('yellow',['banana','pineapple']);
fruitColor1.set('purple',['grape','plum']);
function test(color){
return fruitColor1.get(color)||[];
}
test('yellow')// ["banana", "pineapple"]
我們就可以利用Map這個數(shù)據(jù)結構
簡單來講莺治,Map類似于對象,也是鍵值對的集合帚稠,但是“鍵”的范圍不限于字符串,各種類型的值(包括對象)都可以當作鍵床佳。
const map = new Map([
['name', '張三'],
['title', 'Author']
]);
map.size // 2
map.has('name') // true
map.get('name') // "張三"
map.has('title') // true
map.get('title') // "Author"
在上面我們可以看到Map 也可以接受一個數(shù)組作為參數(shù)滋早。該數(shù)組的成員是一個個表示鍵值對的數(shù)組。
const m = new Map();
m.set('title','zty');
m.set('content','very good');
m.get('title');//zty
m.get('content');//very good