JavaScript中变量/属性名含$前缀、后缀的命名用法是什么？

核心说明 #

JavaScript 原生语法中，$ 只是普通的合法标识符字符，和字母、下划线没有本质区别，没有内置的特殊语法含义。你看到的不带花括号的$用法，均为不同框架、工具链或团队约定的命名规则，不属于原生运算符或语法特性。

前缀带$的属性/变量（如示例中的$prop2） #

常见约定场景如下：

• Vue 生态约定：Vue 实例暴露的内置属性统一以$开头，比如$refs、$emit、$el，不少团队也会给框架注入的全局属性、内置响应式变量加$前缀，避免和业务自定义属性命名冲突
• 代码生成工具约定：预处理器、自动代码生成工具通常会给自动生成的属性加$前缀，和开发者手动编写的业务代码做明确区分
• 旧jQuery遗留习惯：jQuery流行阶段，很多团队会把jQuery实例变量统一加$前缀，该命名习惯也被部分团队沿用至其他场景

后缀带$的属性/变量（如示例中的value$ref） #

这类用法大多和响应式编程生态约定相关：

• RxJS 等响应式流库约定：所有 Observable 流类型的变量统一加$后缀，和普通非响应式变量做区分，快速识别该变量为需要订阅才能取到值的流对象
• Svelte、SolidJS 等响应式框架约定：部分框架会给特殊响应式引用加$后缀，编译器会对这类命名的变量做特殊编译处理
• 部分团队约定：会给需要手动管理销毁的引用类型变量加$后缀，方便内存泄漏排查时快速识别

和模板字符串${}的区别 #

模板字符串中的${}是原生插值语法，和上述命名规则中的$没有关联，只是刚好复用了$字符而已。

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