Sass变量赋值能否传递引用？与Less差异问题咨询

嘿，这个问题刚好戳中了Sass和Less在变量机制上的核心区别，我来给你理清楚～

首先直接给结论：Sass的变量赋值默认是「值传递（静态绑定）」，不存在原生的引用传递机制，你看到的编译结果就是Sass编译器的标准行为，不是bug哦。

用你的代码例子拆解： #

你写的Sass代码：

$a: red; 
$b: $a; 
$a: white; 
body { background-color: $b; }

当执行$b: $a;这一行时，Sass会直接把$a当时的**具体值（red）**复制给$b，相当于$b现在就是一个独立的变量，存的是固定的red。后续修改$a为white，完全不会影响已经赋值完成的$b，所以最终编译结果是body { background-color: red; }。

对比Less的「引用传递」逻辑 #

你之前熟悉的Less是另一种思路：它的变量是动态绑定的引用。同样的代码换成Less：

@a: red; 
@b: @a; 
@a: white; 
body { background-color: @b; }

Less会在最终编译阶段才去解析@b对应的@a的最终值，相当于@b只是指向@a的一个“指针”，所以最后会输出body { background-color: white; }。

那Sass里怎么实现类似「引用」的效果？ #

如果确实需要动态获取变量的最新值，可以借助Sass的函数来实现：

$a: red; 
// 定义一个返回$a当前值的函数
@function get-current-a() {
  @return $a;
}
// 后续修改$a的值
$a: white; 
body { background-color: get-current-a(); }

这样编译后就会得到body { background-color: white; }，因为函数是在调用的时候才去读取$a的最新值，相当于间接实现了“动态引用”的效果。

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