스프레드 연산자 ...

pharmDev·2024년 12월 15일

이 코드는 setState를 사용하여 새로운 일정을 schedules 맵에 추가하거나, 기존 일정 리스트에 추가하는 작업을 수행합니다.
각 코드의 역할과 사용 이유를 단계적으로 설명하겠습니다.


코드 전체:

setState(() {
  schedules = {
    ...schedules,
    schedule.date: [
      if (schedules.containsKey(schedule.date))
        ...schedules[schedule.date]!,
      schedule,
    ]
  };
});

1. setState()

역할:

  • Flutter에서 상태를 업데이트하고 UI를 재렌더링하는 함수.
  • schedules 데이터가 변경되었음을 Flutter에게 알려 화면을 다시 그리도록 합니다.

사용 이유:

  • 새로운 일정이 추가되었으므로, UI에 반영하기 위해 상태를 업데이트해야 합니다.

사용법:

setState(() {
  // 상태 변경 로직
  schedules = updatedSchedules;
});

2. schedules = { ...schedules, ... }

역할:

  • 기존의 schedules 맵을 유지하면서, 새로운 값을 추가하거나 업데이트.
  • { ...schedules }는 기존의 모든 키-값 쌍을 새로 생성된 맵에 복사합니다. 이를 스프레드 연산자라고 합니다.

사용 이유:

  • Flutter의 상태 관리 특성상, 상태 객체를 직접 수정하지 않고 새로 할당해야 합니다.
  • schedules의 변경된 상태를 기반으로 새 맵을 생성하고 기존 데이터를 유지합니다.

사용법:

Map<String, int> oldMap = {'a': 1, 'b': 2};
Map<String, int> newMap = {
  ...oldMap, // 기존 데이터 복사
  'c': 3,    // 새로운 데이터 추가
};
print(newMap); // 출력: {a: 1, b: 2, c: 3}

3. schedule.date: [ ... ]

역할:

  • 새로운 일정 데이터를 특정 날짜(schedule.date)의 리스트에 추가.
  • schedule.date는 새로운 키이며, 해당 날짜에 일정을 저장하기 위한 리스트를 만듭니다.

사용 이유:

  • 맵의 특정 날짜 키에 해당하는 일정 리스트를 업데이트하거나 추가.

사용법:

Map<DateTime, List<String>> schedules = {};

DateTime today = DateTime.now();
schedules = {
  ...schedules,
  today: ['New Schedule'], // 오늘 날짜에 새 일정 추가
};

4. if (schedules.containsKey(schedule.date))

역할:

  • schedule.date 키가 이미 schedules 맵에 존재하는지 확인.
  • 기존 일정 리스트에 새로운 일정을 추가해야 하는지 판단.

사용 이유:

  • 새로운 날짜라면 새로운 리스트를 생성하고,
  • 기존 날짜라면 기존 리스트를 유지하면서 새 일정을 추가.

사용법:

if (schedules.containsKey(today)) {
  print('오늘 날짜에 일정이 이미 존재합니다.');
} else {
  print('오늘 날짜에 새로운 일정 추가');
}

5. ...schedules[schedule.date]!

역할:

  • 특정 날짜(schedule.date)에 해당하는 기존 일정 리스트를 확장(스프레드)하여 복사.
  • ...는 리스트의 모든 요소를 새 리스트에 추가합니다.

사용 이유:

  • 기존 일정을 유지하면서 새로운 일정을 추가하기 위해 사용.

사용법:

List<String> oldList = ['Task 1', 'Task 2'];
List<String> newList = [
  ...oldList, // 기존 리스트 복사
  'Task 3',   // 새로운 작업 추가
];
print(newList); // 출력: [Task 1, Task 2, Task 3]

6. 최종 추가 작업

전체 동작:

  • 1. if (schedules.containsKey(schedule.date)):
    • 해당 날짜의 일정이 이미 존재하는지 확인.
  • 2. ...schedules[schedule.date]!:
    • 기존 일정 리스트를 새 리스트에 복사.
  • 3. [ ... , schedule ]:
    • 기존 리스트에 새로운 일정(schedule) 추가.
  • 4. schedules = { ... }:
    • 변경된 리스트로 새로운 schedules 맵 생성.

최종 코드 설명:

setState(() {
  schedules = {
    ...schedules, // 기존 데이터를 모두 복사
    schedule.date: [
      if (schedules.containsKey(schedule.date)) // 기존 날짜인지 확인
        ...schedules[schedule.date]!, // 기존 일정 리스트 복사
      schedule, // 새로운 일정 추가
    ]
  };
});

7. 사용 예시

시나리오:

  • 오늘 날짜에 이미 "플러터 공부하기" 일정이 있음.
  • "NestJS 공부하기"라는 새로운 일정을 추가.
Map<DateTime, List<String>> schedules = {
  DateTime.utc(2024, 3, 8): ['플러터 공부하기']
};

DateTime selectedDay = DateTime.utc(2024, 3, 8);
String newTask = 'NestJS 공부하기';

setState(() {
  schedules = {
    ...schedules, // 기존 데이터 유지
    selectedDay: [
      if (schedules.containsKey(selectedDay))
        ...schedules[selectedDay]!, // 기존 작업 추가
      newTask, // 새로운 작업 추가
    ]
  };
});

print(schedules);
// 출력: {2024-03-08: [플러터 공부하기, NestJS 공부하기]}

8. 요약

코드역할
setState()상태를 업데이트하고 UI를 다시 그리도록 알림.
{ ...schedules }기존 맵 데이터를 새로운 맵에 복사.
schedule.date: [...]새로운 키-값 쌍을 추가하거나 기존 키의 값을 업데이트.
if (schedules.containsKey(schedule.date))기존 날짜인지 확인하여 적절히 처리.
...schedules[schedule.date]!기존 날짜의 일정 리스트를 확장하여 복사.

이 코드의 핵심은 스프레드 연산자(...)와 조건부 추가(if)를 활용맵 데이터에 새로운 키-값 쌍을 추가하거나 기존 값을 업데이트하는 것입니다. 😊

profile
코딩을 배우는 초보

0개의 댓글