Функции списков Sass

Функции списков Sass

Функции списков используются для доступа к значениям в списке, комбинирования списков и добавления элементов в список.

Списки Sass неизменны (их нельзя изменить). Поэтому функции, возвращающие список из списка, возвращают новый список, а не изменяют исходный список.

Списки Sass основаны на 1. Первый элемент списка находится в индексе 1, а не 0.

Ниже перечислены все функции списков в Sass:

Функция Описание и пример
append(list, value, [separator])

Добавить отдельное значение в конец списка.
Разделитель может быть auto, comma или space. auto - значение по умолчанию.

Пример:

append((a b c), d)

Результат: a b c d

append((a b c), (d), comma)

Результат: a, b, c, d

index(list, value)

Возвращает индекс位置的 значения в списке.

Пример:

index(a b c, b)

Результат: 2

index(a b c, f)

Результат: null

is-bracketed(list)

Проверка наличия скобок в списке.

Пример:

is-bracketed([a b c])

Результат: true

is-bracketed(a b c)

Результат: false

join(list1, list2, [separator, bracketed]

присоединить list2 добавить к list1 в конце.
Разделитель может быть auto, comma или space.
auto - значение по умолчанию (будет использоваться разделитель из первого списка).
bracketed Это может быть auto, true или false. auto - это значение по умолчанию.

Пример:

join(a b c, d e f)

Результат: a b c d e f

join((a b c), (d e f), comma)

Результат: a, b, c, d, e, f

join(a b c, d e f, $bracketed: true)

Результат: [a b c d e f]

length(list)

Вернуть длину списка.

Пример:

length(a b c)

Результат: 3

list-separator(list)

Вернуть строку с используемым разделителем списка. Может быть space или comma.

Пример:

list-separator(a b c)

Результат: "space"

list-separator(a, b, c)

Результат: "comma"

nth(list, n)

Вернуть n-й элемент списка.

Пример:

nth(a b c, 3)

Результат: c

set-nth(list, n, value)

Установить n-й элемент списка в указанное значение.

Пример:

set-nth(a b c, 2, x)

Результат: a x c

zip(lists)

Составление списка в единую многомерную структуру.

Пример:

zip(1px 2px 3px, solid dashed dotted, red green blue)

Результат: 1px solid red, 2px dashed green, 3px dotted blue