- 省略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)
}复制代码