Impara Immutability and Data Modeling in Dart | Writing Clean Dart for Scalable Flutter Apps

Immutability means that once an object is created, its state cannot be changed. In Dart, you achieve immutability by declaring all fields as final and making sure you do not provide setters that allow modification after construction. Immutability is especially beneficial for Flutter state management because it ensures that widget states are predictable and do not change unexpectedly. This predictability makes debugging easier and helps you avoid subtle bugs caused by unintended side effects when data is changed from different parts of your app.

immutable_person.dart


              123456
            
class Person {
  final String name;
  final int age;

  const Person({required this.name, required this.age});
}

When you need to update the data in an immutable object, you do not modify the original instance. Instead, you use a pattern called copyWith. This method creates a new instance of the object, copying existing values and allowing you to override specific fields.

user_profile_widget.dart


              12345678910111213141516171819202122232425262728293031323334353637383940414243444546
            
import 'package:flutter/material.dart';

class UserProfile {
  final String username;
  final int points;

  const UserProfile({required this.username, required this.points});

  UserProfile copyWith({String? username, int? points}) {
    return UserProfile(
      username: username ?? this.username,
      points: points ?? this.points,
    );
  }
}

class UserProfileWidget extends StatefulWidget {
  const UserProfileWidget({Key? key}) : super(key: key);

  @override
  State<UserProfileWidget> createState() => _UserProfileWidgetState();
}

class _UserProfileWidgetState extends State<UserProfileWidget> {
  UserProfile profile = const UserProfile(username: "alex", points: 0);

  void _addPoints() {
    setState(() {
      profile = profile.copyWith(points: profile.points + 10);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text('User: ${profile.username}'),
        Text('Points: ${profile.points}'),
        ElevatedButton(
          onPressed: _addPoints,
          child: const Text('Add Points'),
        ),
      ],
    );
  }
}

Immutability helps prevent bugs in state management by making it impossible to accidentally change the state of an object after it has been created. This is especially important in Flutter apps, where UI updates depend on detecting changes to data. By always creating new objects instead of modifying existing ones, you make it easier to track and understand how state changes over time.

Tutto è chiaro?

Grazie per i tuoi commenti!

Sezione 3. Capitolo 1

Chieda ad AI

Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione

Scorri per mostrare il menu

immutable_person.dart


              123456
            
class Person {
  final String name;
  final int age;

  const Person({required this.name, required this.age});
}

user_profile_widget.dart


              12345678910111213141516171819202122232425262728293031323334353637383940414243444546
            
import 'package:flutter/material.dart';

class UserProfile {
  final String username;
  final int points;

  const UserProfile({required this.username, required this.points});

  UserProfile copyWith({String? username, int? points}) {
    return UserProfile(
      username: username ?? this.username,
      points: points ?? this.points,
    );
  }
}

class UserProfileWidget extends StatefulWidget {
  const UserProfileWidget({Key? key}) : super(key: key);

  @override
  State<UserProfileWidget> createState() => _UserProfileWidgetState();
}

class _UserProfileWidgetState extends State<UserProfileWidget> {
  UserProfile profile = const UserProfile(username: "alex", points: 0);

  void _addPoints() {
    setState(() {
      profile = profile.copyWith(points: profile.points + 10);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text('User: ${profile.username}'),
        Text('Points: ${profile.points}'),
        ElevatedButton(
          onPressed: _addPoints,
          child: const Text('Add Points'),
        ),
      ],
    );
  }
}

Tutto è chiaro?

Grazie per i tuoi commenti!

Sezione 3. Capitolo 1