三分钟学JS设计模式（一）修饰器模式

装饰器（修饰）模式

一、什么是装饰（修饰）模式

装饰器（Decorator）：动态地给一个对象添加一些额外的职责。

打个比方：老王是个打工人，穿上格子衫当程序员，黄袍加身当上美团配送员，穿上睡衣当宅男。老王就是一个纯粹的人，格子衫、黄袍、睡衣是能给他不同的工作属性。

改变老王的属性只需要给他穿不同的衣服（修饰器），就能有不同的功能

二、 优缺点

优点：装饰器与被装饰的组件功能独立，降低耦合度，拆卸、组装自由。

缺点：多个装饰器嵌套出问题的时候要层层排查。

三、场景例子

• Java Spring MVC 中使用 @RequestMapping 来映射请求方法路径。

@Controller
public class UserController {
   
 
	@RequestMapping("/login")
	public String login(String account,String passward) {
   
		return "success";
	}
}

如上，客户端可以通过 /login来访问这个方法实现登陆。我们只需要处理登录的逻辑，至于怎么获取参数、怎么实现Serverlet则是注解实现了。

• Web React antd form ,antd的form表单校验修饰器：

import {
    Form, Icon, Input, Button } from 'antd';
const FormItem = Form.Item;

function hasErrors(fieldsError) {
   
  return Object.keys(