While not commonly utilized in stylesheet development, introspection functions serve as valuable tools for debugging when troubleshooting issues. They provide insights into variables, mixins, and functions to diagnose problems effectively.
Below is a comprehensive table enumerating all introspection functions available in Sass:
Function |
Description |
Examples |
Result |
variable-exists($name) |
Indicates with a Boolean value whether the specified variable is present, either globally or within the current scope. |
$a: 10px; |
true |
variable-exists($not-declared) |
false |
||
global-variable-exists($name) |
Indicates with a Boolean value whether the specified variable exists globally. |
$a: 10px; |
true |
mixin-exists($name) |
Indicates with a Boolean value whether the specified mixin is defined. |
@mixin text-color {color: red; } |
true |
inspect($value) |
Represents $value in its Sass representation. |
inspect(12) |
“12” |
type-of($value) |
Produces a string containing the Sass data type of $value. |
type-of(1 2 3) |
“list” |
unit($number) |
Retrieves the unit linked with a number or an empty string if the number lacks units. |
$a: 10px; |
“px” |
$a: 10; |
“” |
||
unitless($number) |
Indicates with a Boolean value whether the specified number is accompanied by a unit. |
$a: 10px; |
false |
comparable($number1, $number2) |
Indicates with a Boolean value whether the specified numbers are eligible for addition, subtraction, or comparison. |
comparable(1em, 4em) |
true |
comparable(1em, 3px) |
false |
||
comparable(1em, 5) |
true |