Sass Функції списку
Sass Функції списку
Функції списку використовуються для доступу до значень у списку, об’єднання списків і додавання елементів до списків.
Списки Sass незмінні (вони не можуть змінюватися). Отже, функції списку, які повертають список, повертатимуть новий список, а не змінюватимуть вихідний список.
Списки Sass базуються на 1. Перший елемент списку в списку має індекс 1, а не 0.
У наступній таблиці перераховано всі функції списку в Sass:
Функція | Опис & Приклад |
---|---|
append(list, value, [separator]) | Додає одне значення в кінець списку. Роздільник може бути автоматичним, комою або пробілом. За замовчуванням встановлено авто. Приклад: 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, комою або пробілом. 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) | Повертає використаний роздільник списку у вигляді рядка. Може бути пробілом або комою. Приклад: 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 |