はじめに
この実験では、JavaScript を使ってhsl()カラー文字列を値の配列に変換する方法を探ります。正規表現と配列メソッドを組み合わせて、文字列をから数値を抽出し、数値の配列に変換します。この実験は、JavaScript での色の値の扱い方を理解し、正規表現と配列操作のスキルを向上させるのに役立ちます。
HSL を配列に変換する
hsl()カラー文字列を値の配列に変換するには、次の手順に従います。
- ターミナル/SSH を開き、コーディングを練習するために
nodeと入力します。 String.prototype.match()を使って、数値を含む 3 つの文字列を要素とする配列を取得します。Array.prototype.map()をNumberと組み合わせて、それらを数値の配列に変換します。
以下は、hsl()カラー文字列を数値の配列に変換するコードです。
const toHSLArray = (hslStr) => hslStr.match(/\d+/g).map(Number);
使用例:
toHSLArray("hsl(50, 10%, 10%)"); // [50, 10, 10]
まとめ
おめでとうございます!あなたは HSL を配列に変換する実験を完了しました。あなたのスキルを向上させるために、LabEx でさらに実験を練習することができます。