Less不支持default参数机制,其变量和混合参数仅区分是否传入,无运行时存在性校验;需用isunit()守卫判断单位并分支处理,避免unit()强制换单位报错。

Less里没有default参数机制
Less 本身不支持类似函数调用时用 default 关键字做参数校验或回退——这是常见误解,可能源于混淆了 Sass 的 @if not defined($var) 或 JS 的默认参数语法。Less 的变量和混合(.mixin)参数只有“是否传入”的事实,没有运行时类型/存在性校验能力。
用变量守卫 + 单位检测模拟“带默认单位”行为
真正可行的做法是:接收一个可能带单位的值(如 16 或 1.5em),用 isunit() 判断是否已有单位,再按需补单位。这比强行塞 default 更可靠。
常见错误现象:.btn { font-size: @size; } 中若 @size: 14,结果是 font-size: 14;(非法 CSS),浏览器会忽略整条声明。
实操建议:
立即学习“前端免费学习笔记(深入)”;
- 定义混合时,把数值和单位拆成两个参数更可控:
.size(@px, @unit: px) { font-size: unit(@px, @unit); } - 或用守卫自动补单位:
.size(@val) when (isnumber(@val)) { font-size: unit(@val, px); } .size(@val) when (isunit(@val, px)) { font-size: @val; } .size(@val) when (isunit(@val, em)) { font-size: @val; } - 避免对
@val直接做算术(如@val * 1.2),除非先用extract()拆出数值部分
为什么不用unit()直接包裹所有输入
unit(14, px) 确实能生成 14px,但若输入已是 1.5em,unit(1.5em, px) 会报错:Operation on an invalid type。Less 不允许给已有单位的值强制换单位。
所以关键不是“加单位”,而是“有单位就用原样,没单位才补”。这也是为什么必须配合 isunit() 守卫分支处理。
兼容性和维护提醒
Less 3.5+ 支持 isunit(),旧版本需降级用正则匹配(不推荐);另外,混合中用 @arguments 接收不定参数时,无法对每个参数单独守卫,容易漏判单位——这种场景建议显式命名参数。
最易被忽略的一点:CSS 自定义属性(--size)无法在 Less 编译期参与单位判断,这类值必须留给运行时 JS 处理,Less 层只能作静态 fallback。


















