- 省略else
function (condition) { if (condition) { console.log('this') } else { console.log('other') } }()复制代码
日常可以简化为
function (condition) { if (condition) { console.log('this') } console.log('other') }()复制代码
这样if条件不符合时会执行console语句,等同于if else 复制代码
- 使用&&符
function (condition) { not good if(condition) { console.log('this') } } function (condition) { good condition && console.log('this') }复制代码
condition若为true执行console.log('this') 复制代码
- 使用!(非)符号
if(data === null || data === '') bad if(!data) good复制代码
- 使用 Array.includes
function (res) { not good if(res === 'red' || res === 'blue') ... } function (res) { good const coolArray = ['red', 'blue'] if(coolArray.includes(res)) ... } 复制代码
- 使用Array.every & Array.some来判断所有 / 部分
// 判断是否所有水果都是红色 const fruits = [ { name: 'apple', color: 'red' }, { name: 'banana', color: 'yellow' }, { name: 'grape', color: 'purple' } ]; function test() { not good let isAllRed = true; for (let f of fruits) { if (!isAllRed) break; isAllRed = (f.color == 'red'); // false } } function () { good const isAllRed = fruits.every(f => f.color == 'red'); //flase every/some返回布尔值 }复制代码
- 三层以上if可以先return false
function test() { not good if(true) { clnsole.log('第一个执行语句') if(fruits.includes(apple)) { console.log('第二个执行语句') } else { console.log('非fruits.includes(apple)') } } else { throw new Error('error') } } 可以使用倒装判断条件可以先执行error,减少if嵌套&提高性能 function test() { good if(false) throw new Error('error') if(true) { clnsole.log('第一个执行语句') if(fruits.includes(apple)) { console.log('第二个执行语句') } } } 也可以对第二个if进一步处理 function test() { good if(false) throw new Error('error') if(!fruits.includes(apple)) return console('第二个执行语句') if(fruits.includes(apple)) { console.log('第二个执行语句') } }复制代码
原则:尽可能少的嵌套和尽早的return复制代码
- 对象遍历代替switch 根据name,打印对应color
function test(name) { switch (name) { case 'apple': return 'red' case 'banana': return 'yellow' case 'grape': return 'purple' defaule: return '' } } test(null) // '' test('apple') // red 使用对象遍历则更简单 const fruitName = { apple: 'red', banana: 'yellow', grape: 'purple', } functin test(name) { return fruitName[name] || [] } 也可以使用es6 map,可以存储key,value的值 const fruitName = new Map{ .set('apple', 'red'), .set('banana', 'yellow'), .set('grape', 'purple') } functin test(name) { return fruitName.get(name) || [] } 也可以使用filter const fruitName = [ {name: 'apple', color: 'red'}, {name: 'banana': color: 'yellow'}, {name: 'grape': color: 'purple'}, ] functin test(name) { return fruitName.filter(v => v.name == name) }复制代码