本篇文章给大家带来的内容是关于JavaScript复杂判断逻辑写法技巧，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
在某些场景中，我们可能会遇到多个判断条件的情况，针对这种情况，我们通常 会使使用if/else/switch来进行处理，但是多个判断下，这样的写法会有很多的代码，如何解决呢，请继续往下看
首先我们拿if/esle举个栗子，switch写法我就不再这写了
checkStatus(status) {
if (status == 1) {
function1();
} else if (status == 2) {
function2();
} else if (status == 3) {
function3();
} else if (status == 4) {
function4();
} else if (status == 5) {
function5();
}
}通过判断不同的status，执行不同的方法，这是很常见的写法，缺点是代码量很多，且不利于可读性，别人来维护的时候，不能快速的知道这个方法有多少个判断条件，需要调用多少个方法。必须要看完整个方法，才知道这些。下面就介绍些更优化的方法，本文针对vue写法
const actions = {
'1': 'function1',
'2': 'function2',
'3': 'function3',
'4': 'function4',
'5': 'function5'
}
function checkStatus(status) {
let action = actions[status];
this[action]()
}这种写法将方法名和需要判断的类型值进行绑定，调用的时候通过属性名找到对应的属性值即可调用对应的方法，写法简单明了。我们在扩展下，假如类型为1的时候，我们不止要调用一种方法怎么办，请看下面：
const actions = {
'1': ['function1','function2'],
'2': ['function3','function4'],
'3': ['function5','function6'],
}我们可以将类型为1时，需要调用的方法，写在数组里面，那么调用的时候就可以这么拿：
function checkStatus(status) {
let action = actions[status];
this[action[0]]()
this[action[1]]()
}以上两种方法，是针对一元判断的时候使用的，具体使用看具体的场景。
假如是多元判断呢？例如，在判断status为1的时候，我们还需要判断type值为否为1等等。。。
条件对应为
立即学习“Java免费学习笔记（深入）”；
if (status == 1 && type == 1) {
//do someThing
} else if (status == 2 && type == 2) {
//do someThing
} else if (status == 3 && type == 3) {
//do someThing
} else if (status == 4 && type == 4) {
//do someThing
} else if (status == 5 && type == 5) {
//do someThing
}这种业务场景下，如果是用传统的if/else,代码量简直不敢想，接下来，看怎么优化这种情况
const actions = new Map([
[{type:'1',status:1},()=>{/*do sth*/}],
[{type:'2',status:2},()=>{/*do sth*/}],
//...
])
function checkStatus(type,status)=>{
let action = [...actions].filter(([key,value])=>(key.type == type && key.status == status))
action.forEach(([key,value])=>value.call(this))
}这里需要解释的一点是，Map可以用任何类型的数据作为key。我们可以直接判断key是否符合我们的条件，对应的处理方法，可以写在对应的vulue值里面。这种写法基本能满足大部分判断逻辑了。。。下面将难度升级下。。。
上面我们讲到type和status 都是一对一对应的情况下执行相应的方法，加入type为1时，ststus为2和3 都需要执行相同的方法，type为2时，status为1，2也需要执行相同的方法呢？上面的方法也可以使用，下面这样：
const actions = new Map([
[{type:'1',status:2},()=>{functionA}],
[{type:'3',status:3},()=>{/functionB}],
[{type:'2',status:1},()=>{functionC}],
[{type:'1',status:3},()=>{functionA}],
//...
])这样写已经能满足日常需求了，但上面重写了2次status为2的情况还是有点不爽，假如判断条件变得特别复杂，比如type有3种状态，status有10种状态，那你需要定义30条处理逻辑，而往往这些逻辑里面很多都是相同的，再用上面的写法似乎很难接受，那么可以这么写：
const actions = ()=>{
const functionA = ()=>{/*do sth*/}
const functionB = ()=>{/*do sth*/}
const functionC = ()=>{/*send log*/}
return new Map([
[/^1_[1-4]$/,functionA],
[/^2_.*$/,functionC],
//...
])
}
function checkStatus(type,status)=>{
let action = [...actions()].filter(([key,value])=>(key.test(`${type}_${status}`)))
action.forEach(([key,value])=>value.call(this))
}也就是说利用数组循环的特性，符合正则条件的逻辑都会被执行，那就可以同时执行公共逻辑和单独逻辑，因为正则的存在，你可以打开想象力解锁更多的玩法,不懂ES6Map特性，可以去了解下，上面的用法对于大量的判断逻辑来说，的确是优化了很多了。。
愿以后的日子里，不只是有if/else/switch。。。。
