[flutter] 플러터 if문 switch문 사용하기(즉시 실행 함수 표현식)

플러터 코딩을 하다 보면 if문이나 switch문을 쓰고 싶을 때가 있습니다. 하지만 삼항 연산자 대신에 if문을 쓰려고 하면 에러가 나는 경우가 있습니다. 플러터에서 if과 switch문을 쓰는 법에 대해 알아보겠습니다.

---

삼항 연산자를 쓰는 경우(정상 사용 가능)

class HelloScrren extends StatelessWidget {
  const HelloScrren({ Key? key }) : super(key: key);
  @override
  Widget build(BuildContext context) {
    const ko = 'ko';
    return Scaffold(
      appBar: AppBar(title: const Text('test')),
      body:  const Center(
        child: ( ko == 'ko') ? Text('안녕하세요') : Text('Hello')
      )
    );
  } 
}

위와 같이는 삼항 연산자로는 사용이 가능합니다. 이제 이걸 If로 바꿔보겠습니다.

if문 사용시 에러가 나는 이유

위와 같이 if문으로 작성하면 에러가 나버립니다. 왜 if else문은 에러가 나는 걸까요?

Widget build(BuildContext context) {
    const ko = 'ko';
    return Scaffold(
      appBar: AppBar(title: const Text('test')),
      body:  const Center(
        child: 
          if( ko == 'ko') {
            Text('안녕하세요'),
          } else {
            Text('Hello'),
          }  
      )
    );
  }

결론을 말하자면 삼항연산자는 식(expression)이지만 if문은 문(statement)이기 때문입니다. expression처럼 단일 값으로 평가하게 해 줘야만 사용할 수 있습니다.

 

즉시 실행 함수 표현식으로 if문, switch문 사용

아래와 같이 즉시 실행 함수 표현식으로 단일값을 리턴하게 하게 해주는 방식으로 if문을 함수 표현식 안에서 사용하는 방법을 쓸 수 있습니다.

Widget build(BuildContext context) {
    const ko = 'ko';
    return Scaffold(
      appBar: AppBar(title: const Text('test')),
      body: Center(
        child:((){
           if( ko == 'ko') {
            return const Text('안녕하세요');
          } else {
            return const Text('Hello');
          }
        })(),
      )
    );
  }

같은 방식으로 swich문도 작성할 수 있습니다.

Widget build(BuildContext context) {
    const ko = 'ko';
    return Scaffold(
      appBar: AppBar(title: const Text('test')),
      body: Center(
        child:((){
          switch (ko) {
            case 'ko':
            return const Text('안녕하세요');
            default:
            return const Text('Hello');
          }
        })(),
      )
    );
  }

물론 코드가 길어지게 되면 아래와 같이 함수를 만들어서 호출하는 게 더 좋은 방법인 것 같습니다.

Widget build(BuildContext context) {
    const ko = 'ko';
    return Scaffold(
      appBar: AppBar(title: const Text('test')),
      body: Center(
        child: getHelloWidget(ko),
      )
    );
  }
  Widget getHelloWidget(ko) {
    switch (ko) {
      case 'ko':
      return const Text('안녕하세요');
      default:
      return const Text('Hello');
    }
  }

---

여기까지 읽어주셔서 감사합니다.