背景:目前项目里面并未引入装饰器,只是运用了高阶组件,高阶组件的使用在一定程度上提高了代码的复用性,但是装饰器可以更灵活的达到效果和目的,所以准备将装饰器的概念引入到项目里面去且不限于此,提高代码的复用性和可拓展性,增加对react的使用范围,从而提高开发效率,提高团队的开发水平。
装饰器的概念:装饰器是一种特殊类型的声明,它能够被附加到类、方法、访问符、属性或参数上。 这种解释太抽象了 我的理解就是通俗的讲,他是一个方法,可以注入到类、属性、方法、参数上,用于扩展类、属性、方法、参数的功能。 打个比方 你一个组件不具备一个更换背景颜色的功能,但是我使用了一个装饰器(decorators) 那么就可以使我的这个组件具备更换背景颜色的功能了,这就是对组件扩展的一个简单的体现;
常见的装饰器有:普通装饰器(无法传参)、装饰器工厂(可传参)
装饰器类型:
类装饰器
属性装饰器
方法装饰器
函数参数装饰器
类装饰器
类装饰器在类声明之前被声明(紧靠着类声明);
类装饰器应用于类构造函数,可以用来监视、修改或替换类定义;
类的构造函数将作为唯一参数传递给装饰器;
如果类装饰器返回一个值,它会使用返回的构造函数替换原来的类声明;
属性装饰器
属性装饰器用来装饰类的成员属性;
在运行时当作函数被调用,传入下列2个参数:
(1)对于静态成员来说是类的构造函数,对于实例成员是类的原型对象
(2)属性的名字
方法装饰器
方法装饰器用来装饰类的方法(静态方法和实例方法都可以);
方法装饰器可以监视、修改或替换方法定义;
方法装饰器会在运行时传入下列3个参数:
(1)对于静态成员来说是类的构造函数,对于实例成员是类的原型对象。
(2)方法的名字。
(3)方法的属性描述符。
函数参数装饰器
参数装饰器表达式会在运行时当作函数被调用,可以使用参数装饰器为类的原型增加一些元素数据,传入下列3个参数:
(1)对于静态成员来说是类的构造函数,对于实例成员是类的原型对象。
(2)方法的名字。
(3)参数在函数参数列表中的索引。
装饰器执行顺序
装饰器工厂需要先求值,再装饰,求值顺序是由上到下
装饰器可以直接求值,装饰顺序是由下到上