【Dart/Flutter】? / ?? / ?: / ?. / user?.name ?? を完全理解しよう

2025年12月7日 2025年12月7日

cmatrix_blog

【Dart/Flutter】? / ?? / ?: / ?. / user?.name ?? '' を完全理解する｜flutterSchool

flutterSchool ブログ｜Dart の null 安全・条件演算子を一気に整理

Flutter と Dart のコードには、 ?・??・?:・?. といった「記号だらけの表現」が頻繁に登場します。

これらは null 安全 や 条件分岐 を支える非常に重要な構文ですが、似た記号が多く、最初はどう違うのか分かりにくいですよね。

この記事では、それぞれの意味を 一覧で比較 しつつ、実際に動かせる サンプル までまとめて紹介します。

1. 記号ごとの役割を一覧で整理

まずは「何をするための記号なのか」をざっくり把握しましょう。

記号	名称	役割	例
`?`	null許容型	変数や型が `null` を持つことを許可	`String? name;`
`??`	null合体演算子	左側が `null` の場合、右側の値を採用	`name ?? '未設定'`
`?:`	三項演算子	条件によって 2 つの値を切り替え	`age >= 18 ? '大人' : '子供'`
`?.`	null安全アクセス	左側が `null` のとき、プロパティに触らず null を返す	`user?.name`

ポイント
? は「型」の話、
?? / ?: / ?. は「式（値）」の話です。

2. `user?.name ?? ''` はどういう意味？

Flutter のコードレビューなどでよく見るのが user?.name ?? '' という書き方です。

これは「user が null の可能性を考慮しながら、安全に name を取り出し、ダメなら空文字を使う」という意味になります。

user?.name … user が null なら、この時点で null
?? '' … 左が null の場合、空文字 '' を返す

user	user?.name	user?.name ?? ''
{ name: "Taro" }	"Taro"	"Taro"
null	null	""（空文字）

画面にテキストを表示するときに null をそのまま渡すとエラーになる場合が多いため、 user?.name ?? '' は UI コードでの 定番パターン として覚えておくと便利です。

3. まとめて試せるコンソール用コード

ここからは、紹介した記号たちをすべて 1 本のコードにまとめて、実際にコンソール出力で挙動を確認できるようにします。

下記のコードは Dart SDK や DartPad にコピペするだけで動かせます。

class User {
  String name;
  User({required this.name});
}

void main() {
  print('=== Dart の ?, ??, ?:, ?. のサンプル ===');

  // 1. ?（null許容）
  String? nullableName;
  print('\n1. ?（null許容）');
  print('nullableName = $nullableName');

  // 2. ??（null合体）
  String nameOrDefault = nullableName ?? 'デフォルト名';
  print('\n2. ??（null合体）');
  print('nullableName ?? デフォルト名 = $nameOrDefault');

  // 3. ?:（三項演算子）
  int age = 20;
  String ageResult = age >= 18 ? '大人' : '子供';
  print('\n3. ?:（三項演算子）');
  print('age >= 18 ? 大人 : 子供 = $ageResult');

  // 4. ?.（null安全アクセス）
  User? user1 = User(name: 'Taro');
  User? user2 = null;

  print('\n4. ?.（null安全アクセス）');
  print('user1?.name = ${user1?.name}');
  print('user2?.name = ${user2?.name}');

  // 5. user?.name ?? ''（定番パターン）
  print('\n5. user?.name ?? \'\' の例');
  print('user1?.name ?? \'\' = ${user1?.name ?? ''}');
  print('user2?.name ?? \'\' = ${user2?.name ?? ''}');

  // 6. 全部組み合わせた例
  User? user3 = null;
  String message = (user3?.name ?? '').isEmpty ? 'ユーザーなし' : 'ユーザーあり';

  print('\n6. 全部組み合わせ例');
  print('結果: $message');
}
      

4. まとめ

今回紹介した記号たちを、もう一度ざっくり振り返っておきます。

? … null を許容する型 を表す
?? … null のときの デフォルト値 を決める
?: … if / else の省略形（三項演算子）
?. … null かもしれないオブジェクトに 安全にアクセス
user?.name ?? '' … UI での 定番 null 安全パターン

これらを理解しておくと、Flutter のコードレビューや既存プロジェクトの読み解きが一気に楽になります。実務でよく見る書き方なので、ぜひサンプルコードを動かしながら体に覚えさせてみてください。

カテゴリー: Dart言語、Flutter

タグ: null安全チェック三項演算子？マーク

【Dart/Flutter】? / ?? / ?: / ?. / user?.name ?? を完全理解しよう

1. 記号ごとの役割を一覧で整理

2. `user?.name ?? ''` はどういう意味？

3. まとめて試せるコンソール用コード

4. まとめ

コメントを残すコメントをキャンセル

非同期！「基本 → 実践 → Flutter UI と組み合わせ」

1. 記号ごとの役割を一覧で整理

2. user?.name ?? '' はどういう意味？

3. まとめて試せるコンソール用コード

4. まとめ

コメントを残す コメントをキャンセル

非同期！「基本 → 実践 → Flutter UI と組み合わせ」

2. `user?.name ?? ''` はどういう意味？

コメントを残すコメントをキャンセル