API에서 받아올 데이터의 구조를 정의하고, 이를 Dart 객체로 변환하는 작업을 수행하자.
Post 클래스를 정의하고, 이 클래스에서 JSON 데이터를 객체로 변환하는 메서드(fromJson)와 객체를 JSON으로 변환하는 메서드(toJson)를 구현을 해보자.
lib/models/Post.dart 파일 생성
import 'package:equatable/equatable.dart';
// Post 데이터를 표현하는 모델 클래스입니다.
// 서버로부터 받은 JSON 데이터를 Dart 객체로 변환하거나,
// Dart 객체를 JSON으로 변환할 때 사용됩니다.
// Equatable을 사용하여 값 기반 비교를 지원합니다.
class Post extends Equatable {
final int? userId;
final int? id;
final String title;
final String body;
Post({this.userId, this.id, required this.title, required this.body});
// Json 데이터를 Post 객체로 변환하는 생성자를 생성
// 이름이 있는 생성자
Post.fromJson(Map<String, dynamic> json)
: userId = json['userId'],
id = json['id'],
title = json['title'],
body = json['body'];
// Post 객체를 JSON 형식으로 변환하는 메서드를 만들자
Map<String, dynamic> toJson(){
return {'userId': userId, 'id': id, 'title': title, 'body': body};
}
@override
List<Object?> get props => [userId, id, title, body];
}
Post({this.userId, this.id, required this.title, required this.body});
기본 생성자는 객체를 생성할 때 호출됩니다.
userId와 id는 선택 사항이므로 this.userId와 this.id로 선언.
title과 body는 필수 값이므로 required 키워드를 사용해 꼭 값을 전달받도록 설정.
Post.fromJson(Map<String, dynamic> json)
: userId = json['userId'], id = json['id'], title = json['title'], body = json['body'];
이름이 있는 생성자로, JSON 데이터를 Dart 객체로 변환하는 역할을 합니다
매개변수 json: Map<String, dynamic> 타입으로 전달된 JSON 데이터.
JSON의 키(userId, id, title, body)에 해당하는 값을 읽어와 클래스의 속성에 할당.
JSON -> Dart -> JSON ???
JSON → Dart 객체 변환 : Dart 코드에서 데이터 조작을 쉽게 하기 위해서
Dart 객체 → JSON 변환 : 서버로 데이터를 전송 하거나, 저장 하거나, 공유 하기 위해서
(서버는 Dart 객체를 이해하지 못합니다. 따라서 데이터를 서버가 이해할 수 있는 JSON 형식으로 변환해야 합니다. )
왜 Equatable 을 사용해서 객체를 주소 값 비교 기반이 아닌 값 기반으로 비교하는 걸까?
- 실제 애플리케이션 로직에서는 객체가 같은 메모리에 있지 않더라도 내용이 같으면 같은 객체로 간주하는 경우가 많음.
- (동일한 게시물(Post)의 두 인스턴스가 같은 id, title, body 값을 가지고 있다면, 두 객체는 논리적으로 동일한 게시물을 표현합니다)
- 상태 관리 라이브러리(Riverpod, Bloc)에서는 동일한 데이터를 가진 객체가 여러 개 생성되더라도, 값이 같으면 동일한 상태로 간주하는 것이 일반적입니다. 이를 통해 불필요한 상태 변경을 방지하고, 최적화된 상태 관리를 구현할 수 있습니다.
- 또한, 컬렉션(Set, Map)에서 중복 제거를 할 때도 값 기반 비교가 유용합니다. 동일한 값의 객체가 여러 개 생성되더라도 한 번만 저장되도록 관리할 수 있습니다.
- Equatable을 사용하면 직접 == 연산자와 hashCode를 구현하지 않아도, 필요한 필드만 선언하여 쉽게 값 비교 기능을 활용할 수 있습니다.
'Flutter > MVVM 활용' 카테고리의 다른 글
[Flutter] (MVVM 활용) PostRespository를 중앙에서(컨테이너) 관리하는 Provider 계열을 만들어 보자. - 5 (0) | 2024.11.19 |
---|---|
[Flutter] (MVVM 활용) 데이터 접근 계층인 PostRepository 만들어 봅시다. - 4 (0) | 2024.11.19 |
[Flutter] (MVVM 활용) Http 통신 클라이언트 Dio 객체를 만들어 보자 - 2 (0) | 2024.11.19 |
[Flutter] (MVVM 활용) 플러터 프로젝트 생성 - 1 (0) | 2024.11.19 |
[Flutter] riverpod 과 MVVM 활용 (0) | 2024.11.19 |