一元判断多元判断如何实现更优雅的写法

1、一元判断

• switch

/** 
* 按钮点击事件 
* @param {number} 
status 活动状态：1 开团进行中 2 开团失败 3 商品售罄 4 开团成功 5 系统取消 
*/ 
const onButtonClick = (status)=>{ 
  switch (status){ 
    case 1: 
      sendLog('processing') 
      jumpTo('IndexPage') 
      break 
    case 2: 
    case 3: 
      sendLog('fail') 
      jumpTo('FailPage') 
      break 
    case 4:
      sendLog('success') 
      jumpTo('SuccessPage') 
      break 
    case 5: 
      sendLog('cancel') 
      jumpTo('CancelPage')
      break 
    default: 
      sendLog('other') 
      jumpTo('Index') 
      break 
  } 
}

• Object对象：判断条件作为属性，将处理逻辑作为对象的属性值

const actions = { 
  '1': ['processing','IndexPage'], 
  '2': ['fail','FailPage'], 
  '3': ['fail','FailPage'], 
  '4': ['success','SuccessPage'], 
  '5': ['cancel','CancelPage'], 
  'default': ['other','Index'],
} 
const onButtonClick = (status)=>{ 
  let action = actions[status] || actions['default']
  sendLog(action[0]) 
  jumpTo(action[1]) 
}

• Map对象

const actions = new Map([ 
  [1, ['processing','IndexPage']],
  [2, ['fail','FailPage']], 
  [3, ['fail','FailPage']], 
  [4, ['success','SuccessPage']], 
  [5, ['cancel','CancelPage']], 
  ['default', ['other','Index']] 
]) 
const onButtonClick = (status)=>{ 
  let action = actions.get(status) || actions.get('default')
  sendLog(action[0]) 
  jumpTo(action[1]) 
}

2、二元判断

• if-else

const onButtonClick = (status,identity)=>{ 
    if(identity == 'guest'){ 
      if(status == 1){ //do sth }
      else if(status == 2){ //do sth }
      else if(status == 3){ //do sth }
      else if(status == 4){ //do sth }
      else if(status == 5){ //do sth }
      else { //do sth } }
    else if(identity == 'master') { 
      if(status == 1){ //do sth }
      else if(status == 2){ //do sth }
      else if(status == 3){ //do sth }
      else if(status == 4){ //do sth }
      else if(status == 5){ //do sth }
      else { //do sth } 
    } 
}

• Map对象：把两个条件拼接成字符串，并通过以条件拼接字符串作为键，以处理函数作为值的Map对象进行查找并执行，

const actions = new Map([ 
  ['guest_1', ()=>{/*do sth*/}], 
  ['guest_2', ()=>{/*do sth*/}], 
  ['guest_3', ()=>{/*do sth*/}], 
  ['guest_4', ()=>{/*do sth*/}], 
  ['guest_5', ()=>{/*do sth*/}], 
  ['master_1', ()=>{/*do sth*/}], 
  ['master_2', ()=>{/*do sth*/}], 
  ['master_3', ()=>{/*do sth*/}], 
  ['master_4', ()=>{/*do sth*/}], 
  ['master_5', ()=>{/*do sth*/}], 
  ['default', ()=>{/*do sth*/}], 
]) 
/** 
* 按钮点击事件 
* @param {string} identity 身份标识：guest客态 master主态 
* @param {number} status 活动状态：1 开团进行中 2 开团失败 3 开团成功 4 商品售罄 5 有库存未开团 
*/ 
const onButtonClick = (identity,status)=>{ 
  let action = actions.get(`${identity}_${status}`) || actions.get('default') 
  action.call(this) 
}

• Object对象

const actions = { 
  'guest_1':()=>{/*do sth*/}, 
  'guest_2':()=>{/*do sth*/}, 
  //.... 
} 
const onButtonClick = (identity,status)=>{ 
  let action = actions[`${identity}_${status}`] || actions['default'] 
  action.call(this) 
}

// 一个例子
const actions = {
    'gly_nan':()=>{console.log('管理员并且是男的')},
    'gly_nv':()=>{console.log('管理员并且是女的')},
    'yg_nan':()=>{console.log('员工是男的')},
    'yg_nv':()=>{console.log('员工是女的')},
    'default':()=>{console.log('未知')}
}
const onBtnClick = (identity,gener) => {
    let action = actions[`${identity}_${gener}`] || actions['default']
    action.call(this)
}
onBtnClick('yg','nv')  // 员工是女的

Map对象和Object对象有什么区别呢？

1. 一个对象通常都有自己的原型，所以一个对象总有一个"prototype"键。
2. 一个对象的键只能是字符串或者Symbols，但一个Map的键可以是任意值。
3. 你可以通过size属性很容易地得到一个Map的键值对个数，而对象的键值对个数只能手动确认。