Función de clasificación en SASS

Lo principal en cualquier función de clasificación es la capacidad de comparar dos strings y verificar cuál de las dos debe ir antes que la otra. Casi todos los lenguajes de programación tienen algunas funciones de clasificación incorporadas, pero para hacer esto en Sass, debe crear su propia función de comparación de strings. En el primer paso, debemos enseñar a Sass, el orden correcto de clasificación de las strings en función de los caracteres que contiene cada string. Hacemos esto usando una variable.

$sort-order: 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;

Esto se usará para declarar que las strings que comienzan con a deben aparecer antes que las strings que comienzan con b o c y así sucesivamente. También puede agregar otros valores como números, letras mayúsculas o símbolos.
Ahora, necesitará una función de comparación. En la función de comparación, básicamente recorremos los caracteres de cada string y buscamos su orden en la lista de ordenación con la ayuda de la función index() de Sass . Nos dará dos valores que se pueden comparar cual de ellos va antes que el otro. Si los valores son iguales, recorremos el siguiente conjunto de caracteres, y así sucesivamente. 
La función str-compare() devuelve verdadero si $string-a va antes que $string-b y falso si no lo hace. 
 

@function compare($string-a, $string-b, $sort-order) {
  $string-a: to-lower-case($string-a + unquote(""));
  $string-b: to-lower-case($string-b + unquote(""));      
  
  @for $i from 1 through min(
          str-length($string-a), str-length($string-b)) {
  
    $char-a: str-slice($string-a, $i, $i);
    $char-b: str-slice($string-b, $i, $i);
      
    @if $char-a and $char-b and index(
           $order, $char-a) != index($sort-order, $char-b) {
      @return index(
           $sort-order, $char-a) < index($sort-order, $char-b);
    }
  }
    
  @return str-length($string-a) < str-length($string-b);
}

Aquí, usaremos el algoritmo Bubble Sort para ordenar, ya que es el enfoque más básico y fácil. Dado que la ordenación de burbuja se basa en intercambiar dos valores en la array o lista, también necesitaremos una función de intercambio() en Sass. 
La función swap() tomará una lista y dos valores de índice como entrada. Los valores de índice deben intercambiarse en la lista.
Usaremos la función set-nth() , ya que simplemente actualiza la lista en lugar de crear una nueva lista. 
 

@function swap($list, $index-a, $index-b) {
  @if abs($index-a) > length($list) or
               abs($index-b) > length($list) {
    @return $list;
  }
  $temp: nth($list, $index-a);
  $list: set-nth($list, $index-a, nth($list, $index-b));
  $list: set-nth($list, $index-b, $temp);
  @return $list;
}

Ahora, tenemos una función compare() así como una función swap() , lo que significa que estamos listos para crear nuestra función sort() . La función simplemente recorre la lista, compara elementos entre sí y los intercambia una vez comparados hasta que la lista está completamente ordenada. 
 

@function sort($list, $sort-order) {
  @for $i from 1 through length($list) {
  @for $j from $i * -1 through -1 {
      $j: abs($j);
      @if $j > 1 and compare(nth($list, $j),
                  nth($list, $j - 1), $sort-order) {
        $list: swap($list, $j, $j - 1);
      }
    }
  }
  @return $list;
}

Finalmente, necesitamos pasar los valores de string y devolver la función sort().

$list: internships placements classes geeksforgeeks courses;
$sort: sort($list);

Producción:

classes courses geeksforgeeks internships placements

Publicación traducida automáticamente

Artículo escrito por Slash_IT y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *