Javascript design mode system explanation and application

The 1th chapter of the course Introduction
The necessity of learning the design pattern, the course contains the knowledge points, the course arrangement, the study premise
1-1 Guided Learning

The 2nd Chapter Object-oriented
Explains object-oriented concepts in JavaScript, including ES6 class syntax, UML class diagrams, and object-oriented three-factor
2-1 Building Development Environment 1
2-2 Building Development Environment 2
2-3 Building Development Environment 3
2-4 Building Development Environment 4
2-5 what is Object-oriented
2-6 object-oriented-inheritance
2-7 Object-oriented-encapsulation
2-8 Object-oriented-polymorphic
2-9 Object-oriented-application examples
2-10 Object-oriented-summary
2-11 UML Class Diagram 1-Introduction
2-12 UML Class Diagram 2-relationships
2-13 Summary

3rd Chapter Design Principles
Design principles are the basis of understanding design patterns, from design to pattern over. This chapter describes what is the design, 5 principles, in addition, will also explain two on the object-oriented and design principles of the real face questions.
3-1 Design Principles-Introduction
3-2 design principles-what is design 1
3-3 design principles-what is design 2
3-4 Design principles-5 major principles
3-5 Demo with Promise
3-6 Introduction to design Patterns
3-7 23 Design Patterns introduced
3-8 interview Real Title 1-Introduction
3-9 interview Real Title 1-answer
3-10 interview Real Title 2-Introduction
3-11 interview Real Title 2-Paint
3-12 interview Real Title 2-code
3-13 Summary

4th Factory Model
Factory mode is our most commonly used instantiation object pattern, this chapter introduces the basic concept of Factory mode, with fast food burger as a life example to deepen understanding, explain and draw UML class diagram, and finally enumerated the common usage scenarios in JS, such as the $ in jquery, React.createelement,vue Asynchronous components, etc.
4-1 Factory Mode-Introduction
4-2 Factory mode-demos and scenes

The 5th chapter of the single case model
The core structure of the singleton pattern contains only one special class that is called a singleton. Concepts, UML Class diagrams are still required, the scenario used in this chapter is a store with only one $,redux and Vuex in jquery, and only one set of login logic in a system
5-1 Singleton Mode-Introduction
5-2 Singleton Mode-Demo
5-3 Singleton Mode-Scenario (JQ $ and Login box logic) and summary

6th Chapter Adapter Mode
The interface of a class is adapted to what the user expects, and this is the adapter. Replacing the use of the computer attribute computed in jquery's $.ajax,vue in the old project can be seen as an adapter pattern.
6-1 Adapter Mode-Introduction
6-2 Adapter Mode-Demo
6-3 Adapter Mode-Scene (encapsulates the computed of the Old interface &vue)

7th Chapter Decorator Mode
The adorner pattern is a structured pattern, which is a wrapper as an existing class, allowing new functionality to be added to an existing object without altering its structure. This chapter also introduces concepts, UML. Examples of rich/useful scenarios are also used, including ES7 decorators, core-decorators modules, etc.
7-1 Adorner Mode-Introduction
7-2 Adorner mode-Scene 1
7-3 Adorner Mode-Scene 2 (decoration classes and methods)
7-4 Adorner mode-Scene 3 and summary

8th Chapter Agent Mode
Provides a proxy for other objects to control access to this object. Network agent, the star/broker scene is appropriate
8-1 Proxy Mode-Introduction and presentation
8-2 Proxy Mode-Scenario 1 (event Proxy and JQ proxy)
8-3 Proxy Mode-Scene 2 (Star Broker)
8-4 Agent & Adapter & Trim Mode comparison

9th Chapter Appearance Mode
This chapter explains the appearance patterns and explains their concepts, examples
9-1 appearance mode

10th Observer Pattern
Observer mode is the most commonly used, most important design mode, if you only master a design pattern, it must be the Observer mode!!! Starbucks point coffee is relatively close to the scene of life, jquery and Nodejs in the custom event is more classic use
10-1 Observer Patterns-Introduction and presentation
10-2 Observer mode-Scene 1jquery
10-3 Observer mode-Scene 2NodeJs custom events
10-4 Observer Patterns-Other scenarios

11th iterator Mode
The element used to sequentially access the collection object, yes, is the loop. In its own package, the Universal loop method is the classic implementation of the iterator pattern.
11-1 Iterator Mode-Introduction
11-2 Iterator Mode-Demo
11-3 iterator Mode-scene (ES6 Iterator) 1
11-4 iterator mode-Scene 2
11-5 iterator Patterns-code demos and summaries

12th Chapter State Mode
For complex state management, scalability is very poor if you only use If...else to judge. The state mode proposes a design idea which deals with the change of complex state and has good expansibility. The limited state machine, oneself realizes the promise and so on the scene explanation, classics and in-depth
12-1 State Mode-Introduction and presentation
12-2 State mode-Scene 1 (finite state machine)
12-3 state Mode-Scene 2 (write a Promise)

13th chapter Other Design Patterns
This chapter is a unified explanation of some JS in the use of not very frequent design patterns. Although not commonly used, but also to understand its concepts and intentions.
13-1 Overview of other design patterns
13-2 prototype mode
13-3 Bridging mode
13-4 Combination Mode
13-5 enjoy meta mode
13-6 Policy mode
13-7 Template Method mode and Responsibility connection mode
13-8 Command mode
13-9 Memo Mode
13-10 Broker Mode
13-11 visitor mode and interpreter mode
13-12 about interviews and daily use

14th Chapter Comprehensive Application
Design patterns studious, not easy to use. The hardest part is not knowing what patterns to use in what scenarios. This chapter uses a simple shopping cart synthesis example to demonstrate how several common design patterns are used, including the analysis, design, coding, and design pattern parsing of the project.
14-1 Integrated Applications-Introduction and presentation
14-2 Comprehensive application-UML class diagram analysis
14-3 Integrated Application-Drawing UML class diagram
14-4 Integrated Applications-code base environment
14-5 Integrated Applications-Implementing the list component
14-6 Integrated Applications-achieve Item&cart
14-7 Integrated Application-state mode for shopping cart operation
14-8 Integrated Applications-achieve shopping cart listings and discounts
14-9 Integrated Applications-Implementation log
14-10 Comprehensive Application-Summary

The 15th chapter of the course summary
Review the curriculum and summarize the contents of the course
15-1 Course Summary

Baidu Network Disk Download

Javascript design mode system explanation and application