@for y @while

<< @each @debug >>

Estas sentencias funcionan como el @each pero a diferencia del anterior se encuentra asociado por lo general a números. Por ejemplo, si queremos realizar una iteración del 1 al 3 de forma que para cada uno de los valores del bucle (1..3) lo multiplicaremos por 30pixeles de forma que cuando compilemos tengamos una lista de ítems que use los i valores.

.item {
    position: absolute;
    right: 0;
    @for $i from 1 through 3 {
        &.item-#{$i} {
                top: $i * 30px;
        }
    }
}

Con esto conseguimos que para cada uno de los ítems tenga un valor de top diferente. Algo parecido sería si en lugar de usar el @for usamos el @while, la diferencia radica en que con el @while debemos ir actualizando el índice en cada iteración. Veamos cómo sería el ejemplo anterior utilizando un while:

$i: 1;
.item {
    position: absolute;
    right: 0;
    @while $i < 4 {
        &.item-#{$i} {
            top: $i * 30px;
        }
        $i: $i + 1;
    }
}

<< @each @debug >>