【Sass】フィボナッチ数列の第n項を求めるカスタム関数

はじめに

Sassの関数は、予め用意された関数以外にも、自分で好きな関数を定義することができます。

@function 自作関数名($引数){

    @return 戻り値;

}

この@functionで、フィボナッチ数列の第n項を求める関数を定義しました。

内容

自作の関数を定義する@functionディレクティブ以外にも、Ruby ARIを使った自作関数を定義することができますが、
今回はそんなに複雑では無いので、今回はSassのみで書いた。（そもそもRuby知らないのでいづれは・・・）

Sassでフィボナッチ数列の第n項を求めて、デザインに活用できないかなーと。

以下、そのコードです。

@function fib($value){
    @return f(1, 1, $value);
}

@function f($a, $b, $c){

    @if $c <= 2 {
        @return $a;
    }

    @return f($a + $b, $a, $c - 1);
}

div{
    width: fib(7)px;
}

@function内に@functionは無理だった。
2つ目の関数f()は、@returnからf()内で再帰呼び出し。

fib(n)でnに引数を指定して関数を実行。
nに入るのが数列のn番目に当てはまります。

コンパイル結果

div { width: 13px; }

n番目に当てはまる数列の値が返ってくる。