当前位置:网站首页>js装饰器@decorator学习笔记
js装饰器@decorator学习笔记
2022-07-07 02:06:00 【胖鹅68】
一、注解的基本用法
/**
* 注解执行是有顺序的, 顺序如下
* 1. 先执行带参数的注解
* 2. 再按照 出现顺序 执行 属性或 方法的注解
* 3. 最后按照 栈(先书写后执行) 类的注解
*/
@fn
@fn3
@fn2(10) // 这个可以理解为执行了 fn2(10)的函数
class MyClass {
@noEnumerable name = 'huangbiao' // name 无法被遍历到
@readOnly message = 'hello' // message 无法被修改
}
function fn(target) {
console.log('fn')
target.foo = 'bar'
}
function fn2(value) {
console.log('fn2')
return function (target) {
target.count = value
}
}
function fn3(target) {
console.log('fn3', target)
target.prototype.foo = 'baz'
}
function readOnly(target, name, descriptor) {
console.log('fn4')
console.log('target', target) // 目标类的.prototype
console.log('name', name) // 被修饰的类成员名称
/**
configurable: true // 默认值为true 当设置为false 则理解为该属性不可删除不可修改
enumerable: true // 默认值为true 当设置为false 则理解我改属性只读
initializer: ƒ ()
writable: true // 默认值为true 当设置为false 则理解为无法枚举 遍历属性时无法将该属性取出
*/
console.log('descriptor', descriptor) // 被修饰类成员的描述对象
descriptor.writable = false
}
function noEnumerable(target, name, descriptor) {
console.log('fn5')
console.log('target', target) // 目标类的.prototype
console.log('name', name) // 被修饰的类成员名称
/**
configurable: true // 默认值为true 当设置为false 则理解为该属性不可删除不可修改
enumerable: true // 默认值为true 当设置为false 则理解我改属性只读
initializer: ƒ ()
writable: true // 默认值为true 当设置为false 则理解为无法枚举 遍历属性时无法将该属性取出
*/
console.log('descriptor', descriptor) // 被修饰类成员的描述对象
descriptor.enumerable = false
}
console.log('MyClass.foo =>', MyClass.foo) // => bar
console.log('MyClass.count =>', MyClass.count) // => bar
console.log('new MyClass().foo => ', new MyClass().foo) // => baz
const obj = new MyClass()
// obj.message = 'world'
// console.log('obj.message => ', obj.message)
for (var key in obj) {
console.log('key, obj[key]', key, obj[key])
}
二、扩展类
function mixins(...list){
return function (target){
Object.assign(target.prototype, ...list)
}
}
const Foo = {
foo () {
console.log('foo func')
}
}
@mixins(Foo)
class MyClass {
}
let obj = new MyClass()
obj.foo()
边栏推荐
- 360 Zhiyu released 7.0 new products to create an exclusive "unified digital workspace" for the party, government and army, and central and state-owned enterprises
- Common problems of caching in high concurrency scenarios
- MySQL的安装
- Open the blue screen after VMware installation
- 缓存在高并发场景下的常见问题
- Markdown displays pictures side by side
- postgresql 数据库 timescaledb 函数time_bucket_gapfill()报错解决及更换 license
- Calculation model FPS
- 一段程序让你明白什么静态内部类,局部内部类,匿名内部类
- rt-thread 中对 hardfault 的处理
猜你喜欢
随机推荐
Redis(一)——初识Redis
PostgreSQL database timescaledb function time_ bucket_ Gapfill() error resolution and license replacement
You don't know the complete collection of recruitment slang of Internet companies
Haqi projection Black Horse posture, avec seulement six mois de forte pénétration du marché des projecteurs de 1000 yuans!
C语言整理(待更新)
matlab / ENVI 主成分分析实现及结果分析
软件测试的几个关键步骤,你需要知道
地质学类比较有名的外文期刊有哪些?
VIM mapping large K
Overview of FlexRay communication protocol
Rk3399 platform development series explanation (interruption) 13.10, workqueue work queue
[FPGA] EEPROM based on I2C
Jmeter自带函数不够用?不如自己动手开发一个
How to use wechat cloud hosting or cloud functions for cloud development of unapp development applet
c语言(结构体)定义一个User结构体,含以下字段:
Rk3399 platform development series explanation (WiFi) 5.53, hostapd (WiFi AP mode) configuration file description
Redis (II) - redis General Command
Basic DOS commands
进程间通信之共享内存
Leite smart home longhaiqi: from professional dimming to full house intelligence, 20 years of focus on professional achievements