Optimize if code with policy mode [policy mode]

Problem description

At present, there are many in our code if,else To control the flow of the program , But this leads to a problem —— The extensibility of the code is not high .

Here, the policy mode is used for if-else Code optimization

Implementation process

1. Define policy pattern types

/**  Generic type  */
export namespace Common {
    
  /** *  The strategy pattern  * -  state  * - true Function executed at  */
  type StrategyAction = [boolean, () => void];
}

Parameters in , On the left is boolean type , On the right is the corresponding response function

2. Execute the policy mode function

import {
     Common } from "@/types/common/common"

export function exeStrategyActions(actions: Common.StrategyAction[]) {
    
    actions.some((item) => {
    
        const [flag, action] = item
        if (flag) {
    
            action()
        }
        return flag
    })
}

adopt some To execute strategy mode , When corresponding to flag by true when , Execute the corresponding method
some Official definition
The some() method tests whether at least one element in the array passes the test implemented by the provided function. It returns true if, in the array, it finds an element for which the provided function returns true; otherwise it returns false. It doesn’t modify the array.
explain ：
This some Method tests whether at least one function in the array passes the provided function . Turn it into ture, If it finds an element that matches the provided function ; Otherwise it becomes false. It will not change the original array

in other words , When some After finding the first satisfied condition , Then the subsequent methods will not be executed

3. Case use

const action :Common.StrategyAction[] = [
    [
      value === ' home page ',
      () => {
    
        useRouterPush().routerPush('home')
      },
    ],
    [
      value === ' Submit list ',
      () => {
    
        submitListModal.openModal()
      },
    ],
  ]

  exeStrategyActions(action)

• When value When it is the first page , Execute jump routing method
• When value When submitting a list for , Open the pseudo box