final 변수

Coddy Flutter 여정의 앱에 상호작용 추가하기 섹션에 포함된 레슨. 34개 중 16번째.

final은 변하지 않는 값을 가리키는 또 다른 키워드입니다. final 변수에는 값을 한 번만 할당할 수 있으며, 다시는 다른 값을 할당할 수 없습니다.

final int total = _tickets * 12;
total = 50;   // 오류: total은 final입니다

const와의 차이는 값을 언제 알 수 있느냐입니다. const 값은 12처럼 코드를 작성할 때 이미 정해져 있습니다. final 값은 현재 티켓 수에 따라 달라지는 _tickets * 12처럼 앱이 실행되는 동안 계산할 수 있습니다.

const int price = 12;                // 항상 12
final int total = _tickets * price;  // build가 실행될 때 값이 결정됨

build 맨 위에 있는 final 변수는 빌드할 때마다 다시 계산되므로, setState 이후에는 새 합계가 저장됩니다. 한 번 설정한 뒤 읽기만 하는 값에는 final을 사용하고, _tickets처럼 변경하는 값에는 일반 int나 String을 사용하세요.

챌린지

쉬움

티켓 한 장의 가격은 12입니다. build의 맨 위에 const int price = 12;와 _tickets에 price를 곱한 값인 total이라는 final 변수를 추가하세요. Total: ? 대신 Total: 12로 표시하여, 티켓을 한 장 더 추가한 후에는 Total: 24로 표시되도록 하세요.

직접 해보기

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: const HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  int _tickets = 1;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Tickets')),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('Tickets: $_tickets', style: const TextStyle(fontSize: 24)),
            Text('Total: ?', style: const TextStyle(fontSize: 24)),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  _tickets++;
                });
              },
              child: const Text('Add a ticket'),
            ),
          ],
        ),
      ),
    );
  }
}