字符串（Strings）

字符串是字符序列（特别是 Unicode 代码点）。Sass 支持两种内部结构相同但呈现方式不同的字符串：带引号的字符串，例如："Helvetica Neue"和不带引号的字符串（也称为标识符）例如： bold。它们一起涵盖了出现在 CSS 中的不同类型的文本。

您可以使用string.unquote()函数，将带引号的字符串转换为不带引号的字符串，并且可以使用string.quote()函数，将不带引号的字符串转换为带引号的字符串。

@use "sass:string";

@debug string.unquote(".widget:hover"); // .widget:hover
@debug string.quote(bold); // "bold"

SASS 数字支持与 CSS 数字相同的格式，包括科学记数法，它是用 e 数字和 10 的幂之间的一个写成的。由于浏览器对科学记数法的支持历来参差不齐，Sass 总是将其编译为完全扩展的数字。

@debug 5.2e3; // 5200
@debug 6e-2; // 0.06

转义

所有 Sass 字符串都支持标准的 CSS 转义码：

• 除了从 A 到 F 的字母或从 0 到 9 的数字（甚至是换行符！）之外的任何字符，都可以通过在字符串前面写入\来作为字符串的一部分。
• 任何字符都可以作为字符串的一部分包含在字符串中，方法是在\其后跟以十六进制编写的 Unicode 代码点编号。您可以选择在代码点编号后包含一个空格，以指示 Unicode 编号的结束位置。

@debug "\""; // '"'
@debug \.widget; // \.widget
@debug "\a"; // "\a" (a string containing only a newline)
@debug "line1\a line2"; // "line1\a line2"
@debug "Nat + Liz \1F46D"; // "Nat + Liz 👭"

引号

带引号的字符串写在单引号或双引号之间，如"Helvetica Neue"。它们可以包含插值，以及任何未转义的字符，除了：

• \,可以转义为\\;
• 'or "，以用于定义该字符串的为准，可以转义为\'or \"；
• 换行符，可以转义为（包括尾随空格）。

带引号的字符串保证被编译为与原始 Sass 字符串具有相同内容的 CSS 字符串。确切的格式可能因实现或配置而异——包含双引号的字符串可能会编译为"\""或者'"'，非ASCII字符可能会或可能不会转义。但在任何符合标准的 CSS 实现中，包括所有浏览器，都应该对它进行相同的解析。

@debug "Helvetica Neue"; // "Helvetica Neue"
@debug "C:\\Program Files"; // "C:\\Program Files"
@debug "\"Don't Fear the Reaper\""; // "\"Don't Fear the Reaper\""
@debug "line1\a line2"; // "line1\a line2"

$roboto-variant: "Mono";
@debug "Roboto #{$roboto-variant}"; // "Roboto Mono"

无引号

未加引号的字符串被写为 CSS 标识符，遵循下面的语法图。它们可能包括任何地方的插值。

@debug bold; // bold
@debug -webkit-flex; // -webkit-flex
@debug --123; // --123

$prefix: ms;
@debug -#{$prefix}-flex; // -ms-flex

⚠️注意！
并非所有标识符都被解析为不带引号的字符串：

• CSS 颜色名称被解析为颜色。
• null被解析为Sass 的null值。
• true、false，被解析为布尔值。
• not、and、or，被解析为布尔运算符。

因此，编写带引号的字符串通常是一个好主意，除非您专门编写使用不带引号的字符串的 CSS 属性的值。

转义不带引号字符串

解析不带引号的字符串时，转义的文字文本将被解析为字符串的一部分。例如，被解析为字符\、空格、a。但是，为了确保在 CSS 中具有相同含义的不带引号字符串以相同的方式解析，这些转义符被规范化。对于每个代码点，无论是转义还是未转义：

• 如果它是一个有效的标识符字符，它会以未转义的形式包含在未加引号的字符串中。例如，\1F46D返回未加引号的字符串👭。
• 如果它是换行符或制表符以外的可打印字符，则包含在\。例如，\21返回未加引号的字符串\!。
• 否则，小写 Unicode 转义将包含在尾随空格中。例如，\7Fx返回未加引号的字符串\7f x。

@use "sass:string";

@debug \1F46D; // 👭
@debug \21; // \!
@debug \7Fx; // \7f x
@debug string.length(\7Fx); // 5

字符串索引

Sass 有许多获取或返回数字的字符串函数，称为索引，它们引用字符串中的字符。索引1表示字符串的第一个字符。请注意，这与索引从0开始的许多编程语言不同！Sass 还可以很容易地引用字符串的结尾。索引-1指的是字符串中的最后一个字符，-2指的是倒数第二个，依此类推。

@use "sass:string";

@debug string.index("Helvetica Neue", "Helvetica"); // 1
@debug string.index("Helvetica Neue", "Neue"); // 11
@debug string.slice("Roboto Mono", -4); // "Mono"

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com