SCSS 中不存在 meta.type-of()，正确函数是 type-of($value)，用于返回值的类型字符串（如 "number"、"string"、"color"、"list"、"map"、"null"），是参数类型校验的核心手段。
meta.type-of 不是 SCSS 原生函数，它根本不存在——SCSS 标准函数库里没有这个东西。你看到的很可能是混淆了 Sass 的 type-of()（注意没有 meta. 前缀）或误记了其他语言（如 JavaScript 的 typeof）。
SCSS 里真正可用的是 type-of()，不是 meta.type-of()
SCSS 内置函数 type-of($value) 用于运行时判断变量/参数的数据类型，返回字符串如 "number"、"color"、"string"、"list"、"map"、"null" 等。它是做参数校验最轻量也最可靠的方式之一。
- 错误写法：
meta.type-of($size)→ 编译直接报错Undefined function - 正确写法：
type-of($size)→ 可安全用于条件分支 - 典型用途：在 mixin 或 function 中拦截非法传参，避免生成无效 CSS 或静默失败
用 type-of() 防止按钮尺寸 mixin 接收错误类型
比如你在写一个支持 $size 参数的按钮尺寸混合器，但用户可能误传字符串 "large"（带引号）、数字 40、甚至空值 null。不加校验会导致 @if $size == large 永远为 false，最终没匹配到任何分支，CSS 不生成。
- 先检查类型：
@if type-of($size) != "string"→ 直接抛错，不依赖值内容 - 再校验取值：
@if not index(('small', 'base', 'large'), $size)→ 确保是合法枚举值 - 组合使用更健壮：
@mixin btn-size($size) { @if type-of($size) != "string" { @error "btn-size: $size 必须是字符串，如 'small'，当前类型：#{type-of($size)}"; } @if not index(('small', 'base', 'large'), $size) { @error "btn-size: 不支持的尺寸 #{$size}，仅接受 'small'/'base'/'large'"; } // 后续逻辑... }
为什么不用 length() 或 str-length() 替代？
有人想用 length($size) 判断是否为列表，或用 str-length($size) 判断字符串长度来“间接识别类型”。这不可靠：
立即学习“前端免费学习笔记（深入）”；
-
length(123)返回1（数字被转为单元素列表），但123显然不是合法尺寸 -
str-length("large")是5，但"xl"也是字符串、长度 2，却不在白名单里 - 类型错误必须在第一层就拦截，而不是等进入分支后才发现值不匹配
-
type-of()是唯一能明确区分40（number）和"40"（string）的内置手段
容易忽略的边界情况：空字符串和 undefined
SCSS 中未声明的变量读取结果是 undefined，而 type-of(undefined) 返回 "null" ——注意这不是 JavaScript 的 undefined，而是 Sass 的空值表示。这意味着：
- 如果调用
@include btn-size($missing-var)，$missing-var是未定义的，type-of()返回"null"，你的校验会立刻捕获 - 但若用户显式传入
""（空字符串），type-of("")是"string"，仍会通过类型检查，需额外用str-length($size) == 0排除 - 所以完整校验链通常是：
type-of() → 非 null/string → str-length() > 0 → index() 匹配白名单
真正健壮的 SCSS 不靠“默认兜底”，而靠在编译期就拒绝一切模糊输入。类型检查只是起点，后面还得叠加语义校验；而 type-of() 是这条链上最不可跳过的一环——它不解决“对不对”，但能第一时间告诉你“是不是”。
