Функция сортировки онлайн урок.


Sass не предоставляет встроенный способ сортировки списка значений. Благодаря функциям манипуляции строкой мы можем построить функцию для сортировки списка элементов, следующих за заданным порядком.

Если значения, подлежащие сортировке, являются только числами и цифрами, это становится довольно простым, потому что Sass может сравнивать их изначально.

# Сортировочные числа

/// Quick sort
/// @author Sam Richards
/// @param {List} $list - list to sort
/// @return {List}
@function quick-sort($list) {
$less: ();
$equal: ();
$large: ();

@if length($list) > 1 {
$seed: nth($list, ceil(length($list) / 2));

@each $item in $list {
@if ($item == $seed) {
$equal: append($equal, $item);
} @else if ($item < $seed) {
$less: append($less, $item);
} @else if ($item > $SEED) {
$large: append($large, $item);
}
}

@return join(join(quick-sort($less, $order), $equal), quick-sort($large, $order));
}

@return $list;
}

# Сортировка чисел и строк

Однако, если вы собираетесь сортировать строки, а также цифры, это сопряжено с довольно сложной задачей, поэтому давайте сделаем это шаг за шагом.

Во-первых, нам нужен порядок сортировки.

/// Default order used to determine which string comes first
/// @type List
$default-order:
"!" "#" "$" "%" "&" "'" "(" ")" "*" "+" "," "-" "." "/" "[" "\" "]" "^" "_" "{" "|" "}" "~"
"0" "1" "2" "3" "4" "5" "6" "7" "8" "9"
"a" "b" "c" "d" "e" "f" "g" "h" "i" "j" "k" "l" "m" "n" "o" "p" "q" "r" "s" "t" "u" "v" "w" "x" "y" "z" !default;

Затем нам нужна вспомогательная функция, чтобы определить, какое значение будет первым.

/// Compares two string to determine which comes first
/// @access private
/// @param {String} $a - first string
/// @parem {String} $b - second string
/// @param {List} $order - order to deal with
/// @return {Bool}
@function _str-compare($a, $b, $order) {
@if type-of($a) == "number" and type-of($b) == "number" {
@return $a < $b;
}

$a: to-lower-case($a + unquote(""));
$b: to-lower-case($b + unquote(""));

@for $i from 1 through min(str-length($a), str-length($b)) {
$char-a: str-slice($a, $i, $i);
$char-b: str-slice($b, $i, $i);

@if $char-a and $char-b and index($order, $char-a) != index($order, $char-b) {
@return index($order, $char-a) < index($order, $char-b);
}
}

@return str-length($a) < str-length($b);
}

И последнее, но не менее важное: мы можем построить нашу функцию сортировки. Наиболее эффективная реализация (которую можно портировать на Sass) - это алгоритм быстрой сортировки .

/// Quick sort
/// @author Hugo Giraudel
/// @param {List} $list - list to sort
/// @param {List} $order [$default-order] - order to use for sorting
/// @return {List}
/// @require {function} _str-compare
/// @require $default-order
@function quick-sort($list, $order: $default-order) {
$less: ();
$equal: ();
$large: ();

@if length($list) > 1 {
$seed: nth($list, ceil(length($list) / 2));

@each $item in $list {
@if $item == $seed {
$equal: append($equal, $item, list-separator($list));
} @else if _str-compare($item, $seed, $order) {
$less: append($less, $item, list-separator($list));
} @else if not _str-compare($item, $seed, $order) {
$large: append($large, $item, list-separator($list));
}
}

@return join(join(quick-sort($less, $order), $equal), quick-sort($large, $order));
}

@return $list;
}

Если вы заинтересованы в создании такой функции, посмотрите на Реализация алгоритма сортировки Bubble с Sass на пути Sass.