与使用javascript变量相比，使用scss/css有什么优势？

在React Web应用程序的上下文中， css / scss / sass中有哪些功能是使用纯Javascript对象无法获得的功能？

到目前为止，我只能提出以下功能：

1. 精心设计样式，以免它们与逻辑混淆。这个可以
   通过使用专用于样式的Javascript文件仍可以实现
   并导入。


2. 样式组成。仍然可以使用
   传播（...）运算符。使用不可变可以实现安全
   对象。


3. 使用选择器来应用设计。这只是可怜的人imo。如果您可以直接使用变量应用样式，则可以实现相同的结果，而无需任何额外的模板，并且语法更少。

要求了解在给定项目中采用哪种方法。

编辑：我已经强调了这个问题，这不是一个主观的讨论，而是要求在这些框架中找到的功能列表，而在纯js中不存在。