装饰器 — 装饰器修饰类中的方法
最后更新于:2022-04-02 08:10:38
[TOC]
>[success] # 将装饰器作用在类的方法上
~~~
1.装饰器中的默认参数(具体的可以看知识扩展篇):
1.1 @param {Object} 'target' 被装饰器的类的原型
1.2 @param {string} 'name' 被装饰的类、属性、方法的名字
1.3 @param {Object} 'descriptor' 被装饰的类、属性、方法的descriptor
2.最后需要返回'descriptor
'
~~~
>[danger] ##### @+'函数名' 使用工厂方式 -- 给类加自定义的静态属性或者静态方法
~~~
function Dspeak(target, name, descriptor) {
descriptor ={
value(params){
console.log(params,122)
return '我被装饰了'
},
// 如果不配置下面三个项走他们的默认值
writable : false,
configurable : true,
enumerable : true
}
return descriptor
}
class Person{
@Dspeak
speak(params){
console.log(params)
return '我瞎说'
}
}
const person = new Person()
console.log(person.speak('测试装饰器接受参数'))
// 打印结果:
测试装饰器接受参数 122
我被装饰了
~~~
>[danger] ##### 推论类装饰器,target, name, descriptor 指向
~~~
1.通过下面案例的打印结果可以得出结论,target 指向的是被修饰方法的类,
'name' 指向的是修饰的方面名字,'descriptor ' 指向的是被修饰方法的'Object.defineProperty'
2.根据上下两个案例可以发现,如果被修饰的是一个方法,那么 想 修饰这个方法需要,对他的
'Object.defineProperty' 对象中的'value' 做操作,如果是方法则'value' 是一个方法
3.如果被修饰的对象有参数,那么在他的'Object.defineProperty'的'value'方法也可获得传递的参数
~~~
~~~
function Dspeak(target, name, descriptor) {
console.log(target, name, descriptor)
}
class Person{
@Dspeak
speak(params){
return '我瞎说'
}
}
const person = new Person()
console.log(person.speak('测试装饰器接受参数'))
~~~
* 打印结果
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2e3d98044cbba6a22967c88886198a2b_746x102.png)
>[danger] ##### 根据阮一峰老师的案例通过-- apply
~~~
1.在不改变原本被修饰对象返回的内容,并且在之前做一些我们想添加的操作,
可以利用这个案例
~~~
~~~
class Math {
@log
add(a, b) {
return a + b;
}
}
function log(target, name, descriptor) {
var oldValue = descriptor.value;
descriptor.value = function() {
console.log(`Calling ${name} with`, arguments);
return oldValue.apply(this, arguments);
};
return descriptor;
}
const math = new Math();
// passed parameters should get logged now
math.add(2, 4);
~~~
>[danger] ##### @+'函数' 使用方式 -- 给类加自定义的静态属性或者静态方法
~~~
1.简单的案例,参数是否可以被枚举
~~~
~~~
function isEnumerable(params) {
return (target, name, descriptor)=>{
descriptor.enumerable = params
console.log(descriptor)
return descriptor
}
}
class Person{
@isEnumerable(true)
speak(params){
return '我瞎说'
}
}
const person = new Person()
for(let i in person){
console.log(i) // speak
}
~~~
>[info] ## 属性装饰器
~~~
1.通过下面案例可以得到属性装饰器,没有'value' 属性
~~~
~~~
function isEnumerable(params) {
return (target, name, descriptor)=>{
console.log(target, name, descriptor)
descriptor.enumerable = params
console.log(descriptor)
return descriptor
}
}
class Person{
@isEnumerable(false)
speak='12'
}
const person = new Person()
for(let i in person){
console.log(i) // speak
}
~~~
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/5b65ed4cc816edfea688e4fb84815656_751x106.png)
';