関数を使ってプログラムっぽく記述する前のレッスンでは「変数」「演算」を利用したSassの記述について解説しました。続いて「関数」を使った、より高度な記述方法を解説します。ブックマークHTML・CSS公開日:2019/06/11最終更新日:2019/06/11目次1.関数を使って記述する2.代表的なネイティブ関数3.カスタム関数の作り方1.関数を使って記述する関数とは、プログラミング言語の用語で、いくつかの命令・処理内容がまとめられたものです。関数に対して何か値を与えると、値が処理されて、結果が返ってきます。Sassにはあらかじめ用意されている関数「ネイティブ関数」と、自作の関数「カスタム関数」があります。このレッスンでは代表的なネイティブ関数の紹介と、カスタム関数の作り方を解説します。関数の基本的な使い方まずはあらかじめ用意されている`lighten()`というネイティブ関数を使って、関数の使い方を解説します。`lighten()`は指定した色の輝度を明るくする関数です。`()`の中には色と何%明るくするか値を入れます。30%);}コンパイル後の結果です。#ff9999;}ff0000がff9999になって出力されました。このような形で、`関数名`のあとの`()`の中に値を入れると、関数の内容に従って処理が行われ、結果が出力されます。四捨五入、切り上げ、切り捨てround():四捨五入ceil:切り上げfloor:切り捨てこれらの関数を使うと、数値を操作することができます。2;}ランダムrandom():0〜1までのランダムな数値を返す値に例えば100を入れると、1〜100の間でランダムな数値を返します。"Hello";}配列からn番目を取り出すSassは配列が使えます。変数の中にカンマで区切ると、配列になります。配列から1つ取り出したいときの関数です。"banana";}3.カスタム関数の作り方Sassの関数は自作することもできます。以下のように記述します。返り値;}引数に入れた値を連結する関数を作ってみました。"hello,world";}プログラミングについて経験がないとちょっと難しい内容になってきました。カスタム関数についてはあまりデザイナーの方がオリジナルで作るという機会は少ないかもしれません。「こういうものがあるんだ」ぐらいに知っておくと、どこかで役に立つかもしれません。