More than 1 year has passed since last update.

Combineについて学ぶステップ

Last updated at 2023-05-29Posted at 2023-05-29

最近自分はChatGPTに質問プロンプトを投げ込んでその内容を元にプログラミングを学習しています。まさにAI将棋の壁打ちのような感じ。自分を実験台にしてAIと会話することでどのような学習効果が出るのかも実験したいのでCombineについてChatGPTを基本に学習を開始することにした。

Combineについての学習ステップ

Combineの基本概念の理解: Combineは、Publisher、Subscriber、Operatorといった基本概念に基づいています。これらの概念を理解することが第一歩です。
Publisherの理解: Publisherは値を生成し、それらをSubscriberに送信します。Publisherがどのように動作するか、そしてどのようにしてSubscriberに値を送信するかを理解することが重要です。
Subscriberの理解: SubscriberはPublisherから値を受け取り、それらの値をどのように処理するかを決定します。Subscriberがどのように動作し、どのように値を処理するかを理解することが重要です。
Operatorの理解: OperatorはPublisherの間に挿入され、Publisherから送信される値を変換することができます。Operatorがどのように動作し、どのように値を変換するかを理解することが重要です。
Combineを用いた非同期処理の実装: Combineを使って非同期のタスクを実装する方法を学びます。これには、APIからのデータの取得やユーザーインターフェースの更新などが含まれます。
Error Handling: Combineを使ってエラーをどのように扱うかを学びます。これは特に非同期のタスクで重要です。
CombineとSwiftUIの組み合わせ: 最後に、CombineとSwiftUIを組み合わせて非同期のデータフローをどのように管理するかを学びます

合っているかどうかわからないけど、めちゃめちゃわかりやすい。
この概念をまずは頭の片隅に入れることにした。
ではつぎに、

と聞いてみました。

Assistant：もちろんです！以下に、CombineとSwiftUIを使用したシンプルなサンプルアプリのコードを示します。このサンプルでは、ユーザーがテキストフィールドに何か入力するたびに、その入力をデバウンス（一定時間内の入力を無視し、その時間が経過した後に一度だけ反応する技術）してラベルに表示するアプリを作成します。との回答でした。では早速作っていきます。

まず、Combineを使用するために必要なフレームワークをインポートします。

import SwiftUI
import Combine

次に、ViewのStateとPublisherを定義します。

struct ContentView: View {
    @State private var inputText = ""
    @State private var outputText = ""
    
    private let textPublisher = PassthroughSubject<String, Never>()
    private var textSubscriber: AnyCancellable?

次に、PublisherとSubscriberを接続し、デバウンスを行います。

    init() {
        textSubscriber = textPublisher
            .debounce(for: .seconds(1.0), scheduler: RunLoop.main)
            .sink { text in
                outputText = text
            }
    }

最後に、UIを定義します。

    var body: some View {
        VStack {
            TextField("Enter text", text: $inputText)
                .onChange(of: inputText) { newValue in
                    textPublisher.send(newValue)
                }
            Text(outputText)
        }
    }
}

以上がサンプルアプリのコードです。このアプリでは、ユーザーがテキストフィールドにテキストを入力すると、その入力がデバウンスされて1秒後にラベルに表示されます。そのため、ユーザーがテキストを素早く入力しても、ラベルのテキストは1秒間隔でしか更新されません。これがデバウンスの動作の一例です。

まず、PassthroughSubject()についてですが、これはCombineのSubjectと呼ばれる特別な種類のPublisherです。SubjectはPublisherとSubscriberの両方の役割を果たします。つまり、新たな値を受け取り（Subscriberのように）、それを出力（Publisherのように）することができます。ここでPassthroughSubject()が作成されていますが、String型の値を出力するPublisher（つまり、String型の値を送信する）であり、エラーを出力しない（Never型）ということを表しています。

次に、AnyCancellableについてですが、これはCombineのSubscriptionをラップする型です。Subscriptionとは、PublisherとSubscriberの接続を管理するもので、Subscriptionが存在する限りPublisherは値を出力し続けます。AnyCancellableは、Subscriptionを破棄すること（つまり、PublisherとSubscriberの接続を切断すること）が可能なオブジェクトです。

という回答でした。ふむふむ。

デバウンス（debounce）について

これは一定時間内に発生したイベント（この場合はテキストの入力）を無視し、その一定時間が経過した後に一度だけ反応するという振る舞いを指します。例えば、ユーザーがテキストボックスにテキストを素早く入力すると、それぞれの文字入力ごとにイベントが発生します。しかし、このすべてのイベントに反応すると、リソースを無駄に消費することになるかもしれません。そこで、デバウンスを使うと、一定時間（この例では1秒）内の入力は無視され、その時間が経過した後に一度だけ反応（この例ではラベルのテキストの更新）するようになります。

なお、上記のサンプルアプリでは、.debounce(for: .seconds(1.0), scheduler: RunLoop.main)というコードでデバウンスを行っています。これにより、1秒間隔でしかラベルのテキストが更新されないようになっています。

まず、Combineフレームワークの中には、.sinkというメソッドが存在します。これは、Publisherから流れてくる値を受け取って何らかの処理を行うための方法の一つです。シンク（sink）は、水道や川の水が流れ込む場所、つまり最終的な出口を指す英語で、Combineフレームワークの中では、Publisherからのデータの最終的な受け取り場所を指します。

.sinkメソッドは、通常以下の形で使用されます：

publisher.sink { value in
    // Do something with the value
}

ここで、publisherは任意のPublisher、valueはそのPublisherが出力する値です。そして、// Do something with the valueの部分には、受け取った値をどう使うか、つまり値が来たときに何をするかを記述します。

あなたが引用されたコード、outputText = textはまさにその部分にあたります。つまり、Publisherから新たな値（この場合はテキスト）が流れてきたとき、その値をoutputTextに格納する、という処理を行っています。これにより、ユーザーがテキストフィールドに入力したテキストが、デバウンスされた後にoutputTextに格納され、それが画面上のラベルに表示される、という流れが完成します。

ちょっとここで一旦投稿します、、
ChatGPT凄すぎてついていけん…

そこでViewModelをつくります

ViewModel


import SwiftUI
import Combine

class ViewModel: ObservableObject {
    @Published var outputText = ""

    private let textPublisher = PassthroughSubject<String, Never>()
    private var textSubscriber: AnyCancellable?

    init() {
        textSubscriber = textPublisher
            .debounce(for: .seconds(1.0), scheduler: RunLoop.main)
            .sink { text in
                self.outputText = text
            }
    }

    func send(_ text: String) {
        textPublisher.send(text)
    }
}

View

import SwiftUI
import Combine

struct ContentView: View {
    @State private var inputText = ""
    @ObservedObject private var viewModel = ViewModel()

    var body: some View {
        VStack {
            TextField("Enter text", text: $inputText)
                .onChange(of: inputText) { newValue in
                    viewModel.send(newValue)
                }
            Text(viewModel.outputText)
        }
        .padding()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up