条件判断

写法比较

if else 适用于：

1. 对具体的值进行判断
2. 区间的判断
3. 对运算的结果是boolean类型表达式进行判断  true   false

if(...){
   ...
}else if(...){
   ...   
}else{
	...
}

switch 适用于：

1. 对具体的值进行判断
2. 这个值是固定的
3. 值的可能性多

switch (+state) {
  case 'loaded':
    this.sound.play()
    break
  default:
    Toast.loading()
    this.sound.play()
    break
}

对象的方式 适用于：

1. 返回多个结果
2. 少量的、固定的值

const judgeTypeDict = {
  0: {
    typeDescription: '单选题',
    iconType: iconRadio,
    iconSelect: iconRadioCorrect,
  },
  1: {
    typeDescription: '多选题',
    iconType: iconCheckout,
    iconSelect: iconCheckoutCorrect,
  },
}

const { typeDescription, iconType, iconSelect } = judgeTypeDict[type]

三目运算符 适用于：

1. 条件少、返回值类型一致

// 推荐
const result = score >= 60 ? '合格' ： '不合格'
// 不推荐这样的方式，推荐使用 梯度函数
+value / denominator >= 1 ?
      +value / denominator >= 10000 ?
        `${(+value / (denominator * 10000)).toFixed(2)}亿` :
        `${(+value / denominator).toFixed(2)}万` : +value;

梯度函数 适用于：

1. 区间的判断

const checkList = [
  {
    check: value => value >= 1000 * 10000,
    format: value => '999万+',
  },
  {
    check: value => value >= 10000,
    format: value => {
      const result = Math.round(+value / 10000)
      if (result === 1000) {
        return '999万+'
      }
      return `${result}万`
    },
  },
  {
    check: value => value >= 0,
    format: value => value,
  },
]

export const numberFormat = number => {
  const checker = checkList.find(item => item.check(number))
  return checker.format(number)
}

numberFormat(9999)

const getResourceIcon = (videoUrl, audioUrl) => {
  if (videoUrl) {
    return iconVideo
  }

  if (audioUrl) {
    return iconAudio
  }

  return iconNote
}

常用函数

时间判断

今天 显示：今天10:30
今年 显示：11-12 10:30
不是今年 显示：2009-11-12 10:30

import dayjs from 'dayjs'

const currentYear = new Date().getFullYear()
const startDay = new Date(new Date().toLocaleDateString()).valueOf()
const endDay = startDay + 24 * 60 * 60 * 1000

export const timeFormatList = [
  {
    check: time => time >= startDay && time < endDay,
    render: time => '今天 ' + dayjs(time).format('HH:mm'),
  },
  {
    check: time => dayjs(time).year() === currentYear,
    render: time => dayjs(time).format('MM-DD HH:mm'),
  },
  {
    check: () => true,
    render: time => dayjs(time).format('YYYY-MM-DD HH:mm'),
  },
]

export const timeFormat = time => {
  const checker = timeFormatList.find(item => item.check(time))
  return checker.render(time)
}

timeFormat('时间戳')

复杂判断

 interface IcalcStatus {
  hasPromotion: boolean;
  initTime?: number;
}

const calcStatus = {
  0: () => {
    return {
      hasPromotion: true,
    };
  },
  1: () => {
    if (currentTime > milliActivityBeginTime && currentTime < milliAactivityEndTime && inventory > 0)
      return {
        hasPromotion: true,
        initTime: milliAactivityEndTime - currentTime,
      };
    return {};
  },
  2: () => {
    if (currentTime > milliActivityBeginTime && currentTime < milliAactivityEndTime)
      return {
        hasPromotion: true,
        initTime: milliAactivityEndTime - currentTime,
      };
    return {};
  },
  3: () => {
    if (inventory > 0)
      return {
        hasPromotion: true,
      };
    return {};
  },
};

const { hasPromotion = false, initTime = 0 } = calcStatus[sellStatus]() as IcalcStatus;

更优写法

const calcStatus = [
  {
    check: value => value === 0,
    format: { hasPromotion: true, initTime: 0 },
  },
  {
    check: value => value === 1 && currentTime > milliActivityBeginTime && currentTime < milliAactivityEndTime && inventory > 0,
    format: { hasPromotion: true, initTime: milliAactivityEndTime - currentTime },
  },
  {
    check: value => value === 2 && currentTime > milliActivityBeginTime && currentTime < milliAactivityEndTime,
    format: { hasPromotion: true, initTime: milliAactivityEndTime - currentTime },
  },
  {
    check: value => value === 3 && inventory > 0,
    format: { hasPromotion: true, initTime: milliAactivityEndTime - currentTime },
  },
];
const checker = calcStatus.find(item => item.check(sellStatus)) || {
  format: { hasPromotion: false, initTime: 0 },
};
const { hasPromotion, initTime } = checker.format as IcalcStatus;