类的装饰器:修饰类、参数、属性

javascript 专栏收录该内容
8 篇文章 0 订阅


// 装饰器   es7的 实验性语法 后面可能会有改动  vue2刚开始用的就是装饰器

// 装饰器的作用 就是扩展类, 扩展类中的属性和方法

function addSay1(target:any){
    return function(target:any){
        console.log(1);
    }
}
function addSay2(target:any){
    return function(target:any){
        console.log(2);
    }
}
function addSay3(target:any){
    return function(target:any){
        console.log(3);
    }
}

function eat(target:any){  //target => 类的原型
    target.prototype.eat=function(type){
        console.log('eat');
    }
}



/* 
@eat */
class Person{
  /*   eat!:()=>void */
    @toUpperCase
    public name:string='jim';

    @double
    static age:number=18;   // 静态属性要通过类来调用

    @Enum(false)   //方法的话就是属性描述器
    drink(@params content:any){

    }

}

let p=new Person();
/* p.eat(); */
console.log(p.name);

// 类和装饰器要写在一起
function toUpperCase(target:any,key:string){  //target 是类的原型,key就是修饰的属性
    let val:string='';
    Object.defineProperty(target,key,{   //原型定义属性
        get(){
            return val;
        },
        set(newVal:string){
            console.log(newVal);
            val=newVal;
        }
    })
}

function double(num:number){
    return function(target:any,key:string){   //target 指的是类
        let v=target[key];
        Object.defineProperty(target,key,{
            get(){
                return num * v;
            }
        })
    }
}

// 1、装饰器  修饰类的实例

// 2、装饰器  修饰类中静态的内容

// 亮色的是可枚举的  灰色的就是不可枚举的。


function Enum(Enum:boolean){
    return function(target:any,key:string,descriptor:PropertyDescriptor){   //target 肯定指的是原型

    }
}

function params(target:any,key:string,index:number){  //target 原型key drink  index=>0
    console.log(target,key)
}


// 装饰器能修饰:实例、静态属性、方法、方法中的参数
// 属性的话  就是索引,方法的话属性描述器 PropertyDescriptor
// 类的话修饰的时候就一个参数

// 静态的属性  就是有个顺序 类产生以后才会有这个属性

// 静态的指向类,实例上的指向原型

// 修饰类、修饰属性、修饰参数

  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 终极编程指南 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值