HubLで配列の取得範囲を指定して効率の良いforループを実装する方法

HubSpotでHubLコードを書いていると頻繁に使用するforループは配列を指定するだけで簡単に実装できます。

forループは基本的に最初から最後までループするのが当たり前ですが、要件によっては途中から始めたり、途中で終わらせたいなどがあります。

そんな場合はif文で分岐すればいいですが、それよりも配列の取得範囲を指定すればもっと効率よく無駄のないループを作ることが可能です。

通常のforループ

まずは通常のforループのサンプルコードを見ていきましょう。公式サイトのfor文の説明はこちらです。

{% set list = ['A', 'B', 'C', 'D', 'E', 'F'] %}
{% for item in list %}
  {{ item }}
{% endfor %}

このforループは配列の最初から最後まで出力するコードです。

例えば、3つまで表示したい場合は以下のようにifで対処することができます。

{% for item in list %}
  {% if loop.index0 < 3 %}
    {{ item }}
  {% endif %}
{% endfor %}

結果 A B C と出力されますが、実際は最後までループするので膨大な処理を行う場合に負荷が気になります。

そんな時にコロンを使ったスライスを使用すれば配列を切り出すことができるので効率の良いforループを作ることができます。

コロンを使ったスライスの例は以下です。

{% set list = ['A', 'B', 'C', 'D', 'E', 'F'] %}
{% for item in list[0:3] %}
  {{ item }}
{% endfor %}

2行目のlistの後ろに[0:3]を指定しました。これだけで配列を切り出すことができます。

[0:3]は[start:stop]と解釈され、startは開始位置でstopが終了位置です。

例えば[2:5]の場合は下図のように[C, D, E]が取得できます。

セミコロンを使用したスライスの例

注意点としてはstopで指定した5はFを含まない点でしょうか。

配列で値を取得する場合list[5]であればFになるため混乱しないよう注意が必要です。

また、このコロンを使ったスライスはstartとstopを省略することが可能で、stopを省略して[2:]にすると[C, D, E, F]、逆にstartを省略して[:2]にすると[A, B]が取得できます。

執筆時点では公式ドキュメントに記載されていないため注意が必要かもしれませんが、コロンを使用して配列をスライスすると無駄のないループ処理を実装できるようになります。

また、この方法は文字列にも使用することができるので活用してみてはどうでしょうか。