js design patterns: what is strategy pattern? Introduction to js strategy pattern

This article brings you content about js design patterns: What is the strategy pattern? The introduction of js strategy mode has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

What is the strategy pattern?

Definition: Different strategies can be hit according to different parameters

Main solution:When there are many similar algorithms In this case, using if...else brings complexity and difficulty to maintain.

When to use the Strategy Pattern: There are many situations, and what distinguishes them is only their direct behavior.

How to solve: Map different strategies through a hash object.

Advantages of js strategy mode: 1. The algorithm can be switched freely. 2. Avoid using multiple conditional judgments. 3. Good scalability and reusability.

Disadvantages of js strategy mode: 1. Strategy categories will increase. 2. All strategy classes need to be exposed to the outside world.

Strategy mode usage scenarios: 1. The running method needs to be dynamically changed based on behavior. 2. In order to reduce the code and make the code more readable. 3. Unified management of policies is required.

Strategy pattern in js

Observe the following demo of obtaining the year-end bonus, and obtain different strategy methods (rules) according to different parameters (level). This is a classic application of the strategy pattern in JS. one.

 const strategy = {
  'S': function(salary) {
    return salary * 4
  },
  'A': function(salary) {
    return salary * 3
  },
  'B': function(salary) {
    return salary * 2
  }
}

const calculateBonus = function(level, salary) {
  return strategy[level](salary)
}

calculateBonus('A', 10000) // 30000

In JS where functions are first-class citizens, the use of js strategy pattern is often hidden in higher-order functions. Slightly change the form of the above demo as follows, you can find that we are already using it. Congratulations We've mastered yet another design pattern.

const S = function(salary) {
  return salary * 4
}

const A = function(salary) {
  return salary * 3
}

const B = function(salary) {
  return salary * 2
}

const calculateBonus = function(func, salary) {
  return func(salary)
}

calculateBonus(A, 10000) // 30000

Related recommendations:

Detailed explanation of the proxy pattern of JS design pattern

Singleton of php design pattern Pattern code, php design pattern

The above is the detailed content of js design patterns: what is strategy pattern? Introduction to js strategy pattern. For more information, please follow other related articles on the PHP Chinese website!