TypeScript/Vue代码中@符号是什么含义？属于哪类技术特性？

你看到的@开头的语法叫做装饰器（Decorator），不是注释，是给类、类方法、类属性等附加额外逻辑的语法糖。

关于归属的说明 #

• 它不是Vue、也不是TypeScript独有的特性：最早是ES2016（ES7）提出的语法提案，目前处于TC39标准流程的stage 3阶段，尚未成为ECMAScript的正式标准。
• TypeScript提前实现了装饰器支持，需要在tsconfig.json中开启experimentalDecorators配置项才能正常编译。
• 你示例代码里的@Module、@Mutation、@Action是vuex-module-decorators库提供的专用装饰器，用来简化Vuex的TypeScript类式写法。

示例中各个装饰器的具体作用 #

装饰器本质是封装了通用逻辑的函数，编译阶段会自动把逻辑注入到它修饰的目标上，代替你写重复的模板代码：

• @Module：将当前类标记为Vuex的模块，自动完成模块注册相关的逻辑，不需要手动写Vuex模块的配置对象。
• @Mutation：将它修饰的方法标记为Vuex的mutation，自动封装Vuex mutation的更新规则，调用时需要通过commit触发。
• @Action：将它修饰的方法标记为Vuex的action，自动封装Vuex action的异步处理规则，调用时需要通过dispatch触发。

它完全没有注释的作用，所以不能用//代替，注释不会参与代码编译运行，而装饰器是会实际影响代码逻辑的有效语法。

内容的提问来源于stack exchange，提问作者TinyTiger