Thymeleaf if文と三項演算子を比較しよう
新人
「Thymeleafでif文と三項演算子、どちらを使えばいいか迷っています…」
先輩
「どちらも条件分岐に使えるけれど、状況によって向き不向きがあるんです。丁寧に比べてみましょう」
新人
「具体的なコード例で比べてみたいです!」
先輩
「では、Pleiades+Gradle環境でSpring Bootの@Controlleを使った実例で学びましょう!」
1. Thymeleafのif文の基本
まずは if文 を使った条件分岐の基本から見ていきましょう。if文は条件が複数行にまたがる場合や出力内容が複雑なケースで主に使われます。たとえば、ログイン状態を判定して表示内容を切り替える例です。
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class StatusController {
@GetMapping("/welcome")
public String welcome(Model model) {
boolean loggedIn = checkLogin();
model.addAttribute("loggedIn", loggedIn);
return "welcome";
}
private boolean checkLogin() {
return true;
}
}
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>ようこそ</title></head>
<body>
<h1>表示例</h1>
<div th:if="${loggedIn}">
<p>ようこそ、ログイン中のユーザーさん!</p>
</div>
<div th:if="${!loggedIn}">
<p>ログインしていません。ログインしてください。</p>
</div>
</body>
</html>
このように th:if に boolean 値を渡すだけで、条件分岐が簡単に実現できます。if文は読みやすく、ロジックがはっきりする点で SEO 対策にも有利ですし、Spring Boot や Pleiades+Gradle 環境で使われる代表的な方法です。
2. 三項演算子の基本
次に、三項演算子(?:)を使った条件分岐方法です。コード量を減らしたいときに使われ、簡潔に記述できます。ただし可読性は if 文に劣ることがあります。
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>三項演算子例</title></head>
<body>
<h1>表示例(簡潔版)</h1>
<p th:text="${loggedIn} ? 'ようこそ、ログイン中!' : 'ログインしてください'"></p>
</body>
</html>
この例では、th:text 内の三項演算子で、loggedInが true のときと false のときで出力文字列を切り替えています。これだけで条件分岐できるので、簡単な表示切替に向いています。
ただし、複雑なロジックや HTML ブロックごとの切り替えには向いていません。複数の要素を切り替えるときは if 文を使った方法の方が分かりやすいため、状況に応じて両者を使い分けるのが上手な書き方です。
3. if文と三項演算子の違いと使い分け
if文と三項演算子は、Thymeleafで条件分岐を行うときによく使われますが、それぞれ得意な場面が異なります。if文は複数行のHTMLをまとめて切り替えたいときや、コメントを入れたいときに向いています。一方、三項演算子は1行で簡潔に書きたいときに便利です。
- if文:HTMLブロック単位で表示/非表示を切り替えたいとき
- 三項演算子:1つのタグ内で文字列やクラス名だけを切り替えたいとき
たとえば、ボタンのテキストを切り替えるだけなら三項演算子が良いですが、複数の要素やスタイルまで一気に変えたい場合は if文 が分かりやすくなります。
4. 三項演算子を使った実務例
次に、実務で使えそうな三項演算子の例を見てみましょう。例えば、商品の在庫状況に応じてクラス名と表示文字を変えるケースです。
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>在庫表示</title></head>
<body>
<h1>商品情報</h1>
<p th:text="${inStock} ? '在庫あり' : '在庫なし'"
th:class="${inStock} ? 'text-success' : 'text-danger'"></p>
</body>
</html>
この例では、inStockがtrueなら「在庫あり」と緑文字、falseなら「在庫なし」と赤文字になります。1行で完結していてコードがシンプルで見やすく、Gradle+Pleiades環境でもすぐ動作確認できます。
5. if文と三項演算子を組み合わせる例
最後に、if文と三項演算子を組み合わせて使う例をお見せします。if文でブロックを切り替え、三項演算子で細かいテキストやクラスを切り替えるパターンです。
@GetMapping("/product")
public String showProduct(Model model) {
boolean inStock = checkStock();
model.addAttribute("inStock", inStock);
model.addAttribute("price", 1500);
return "product";
}
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>商品詳細</title></head>
<body>
<h1>商品詳細画面</h1>
<div th:if="${inStock}">
<p th:text="'価格:¥' + ${price}">価格表示</p>
<button th:class="${price > 1000} ? 'btn btn-primary' : 'btn btn-secondary'">購入する</button>
</div>
<div th:if="${!inStock}">
<p>申し訳ありません。在庫がありません。</p>
</div>
</body>
</html>
このコードでは、在庫ありなら価格と購入ボタンを表示し、ボタンの色は三項演算子で決めています。テンプレート内のロジックが整理でき、読みやすさと柔軟性が両立できます。Pleiades+Gradleで試してみてください。
6. 実際の画面に反映させる例
ここでは、実務でよくある「セール中フラグ」による表示切り替え例を通じて、if文と三項演算子の両方を使ったテンプレート記述を紹介します。
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class SaleController {
@GetMapping("/items")
public String showItems(Model model) {
boolean onSale = true; // セール中かどうかの判定フラグ
int stock = 3; // 在庫数
model.addAttribute("onSale", onSale);
model.addAttribute("stock", stock);
return "items";
}
}
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>商品一覧</title></head>
<body>
<h1>商品一覧</h1>
<!-- if文でセール用メッセージをブロックで切り替え -->
<div th:if="${onSale}">
<p style="color:red;">只今セール中!</p>
</div>
<div th:if="${!onSale}">
<p>通常販売中です。</p>
</div>
<!-- 三項演算子で在庫状況を1行で出力 -->
<p th:text="${stock > 0} ? '在庫:' + ${stock} + '個' : '在庫なし'"></p>
</body>
</html>
このように、th:ifでHTMLブロック単位の切り替えを行い、三項演算子で単一タグ内の文字列判定を同時に使うと、テンプレートが読みやすく整理できます。Gradleでビルド・実行しながらPleiades上で確認しましょう。
7. 初心者が学習を進めるコツ
Thymeleafのif文や三項演算子を効率よく学ぶために、以下のポイントを意識すると理解が早く進みます。
小さなサンプルから始める
まずBoolean変数だけを使ったシンプルな画面から作り、if文だけ、三項演算子だけの切り替えを体験してみましょう。一度に多くの判定を詰め込まないことが上達の秘訣です。
Pleiades+Gradleでこまめにビルド
Gradleで ./gradlew build を頻繁に実行し、コンパイルエラーや警告に素早く気づく習慣をつけましょう。Modelに渡した変数とテンプレートの式が一致しているかをチェックできます。
ログを使ってデバッグする
if文や三項演算子の条件が意図したとおりに動かないときは、@Controller内で System.out.println(onSale) などの出力を入れて変数の中身を確認しましょう。ログ出力は初心者にとって強力な学習ツールです。
コードコメントを忘れずに書く
テンプレートに<!-- セール中なら赤字で表示、在庫に応じてテキスト切り替え --> などのコメントを加えておくと、後から見返したときに意図を理解しやすくなります。
他の条件分岐パターンにも挑戦する
例えば、リストの有無やサイズ判定、nullチェックなど様々な条件分岐を試してみましょう。Thymeleafの式や条件分岐に慣れることで、Web画面作成の応用力が養われます。
8. まとめ
この記事では、Pleiades+Gradle環境でのSpring Bootアプリケーションにおいて、Thymeleafのif文と三項演算子による条件分岐について、初心者向けにわかりやすく比較と使い分けのポイントを解説しました。
- if文はHTMLブロック単位の表示切り替えに向いており、可読性と保守性が高い
- 三項演算子は1行で簡潔に書けるが、複雑な構造には不向き
- 実務では両者を組み合わせて柔軟に使い分けると、テンプレートがすっきりする
- Gradleビルドとログ出力を活用して、実行しながら動作確認・学習を進めよう
初心者の段階では、まず小さなサンプルからif文や三項演算子を体験し、慣れてきたら実務で組み合わせた応用例に挑戦してみましょう。Thymeleafを使ったWeb開発の第一歩として、ぜひPleiades+Gradle+Spring Boot+Thymeleafで実際に手を動かして学習してください!