# 介绍
* 为对象添加新功能
* 不改变其原有的结构和功能
# 在项目中使用装饰器模式
**可以通过babel在项目中使用**
* 命令行:
babel 6.x 使用`babel-plugin-transform-decorators-legacy`插件:
`npm install babel-plugin-transform-decorators-legacy --save-dev`
babel 7.x使用`@babel/plugin-proposal-decorators`插件:
`npm install @babel/plugin-proposal-decorators --save-dev`
* 编辑`.babelrc`文件
```
{
"presets": ["@babel/preset-env"],
"plugins": [
["@babel/plugin-proposal-decorators", {"legacy":true}]
]
}
```
![](https://img.kancloud.cn/2a/f4/2af40cb1f1e4bea5394ca38930ec66f4_902x1084.png)
![](https://img.kancloud.cn/fe/e1/fee1d786645c00251277fb99e5bd5c88_1694x1264.png)
![](https://img.kancloud.cn/9d/78/9d78184e204b320f5a17d15fb5a5edc1_2146x830.png)
![](https://img.kancloud.cn/2f/a9/2fa9fc46bc35a689d9436c7d84e72e8f_2488x1230.png)
![](https://img.kancloud.cn/77/c2/77c29202dd9ee6712c53a2797e46cd67_1708x824.png)
# 第三方装饰器
**core-decorators**
* 第三方开源lib
* 提供常用的装饰器
* 文档[链接][https://github.com/jayphelps/core-decorators](https://github.com/jayphelps/core-decorators)
* 使用示例
![](https://img.kancloud.cn/15/f8/15f8849f84b17cc27cffa79540fe6dca_1404x1070.png)
# 设计原则验证
* 将现有对象和装饰器进行分离,两者独立存在
* 符合开放封闭原则