Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

データストアの同イベントに複数のコールバックを登録・解除する

More than 5 years have passed since last update.

概要

Milkcocoaのデータストアの同一イベント(たとえばpush)に、複数のコールバックを登録したり解除するとどうなるか確認してみた。特に解除するときに1つ1つ解除されるのか、それとも全部解除されるのかを試してみた。

登録・解除

データストアイベントへコールバックを登録するにはdatastore.on(イベント名,コールバック)でできる。今回はpushイベントに対して複数のコールバックを登録してみる。ボタンを押すとデータストアにデータがpushされるので、それに対して登録されたコールバックがどうなるか確認する。
解除はdatastore.off(イベント名)でできる。これでpushイベントに登録されたコールバックが1つずつ解除されるのか、それとも全部解除されるのか確認する。

結果

下記コードで試した。

コード
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>

<body>
    <button id="send_button">send message</button>
    <button id="off_button">off</button>

    <script src='https://cdn.mlkcca.com/v2.0.0/milkcocoa.js'></script>
    <script>
        var milkcocoa = new MilkCocoa("{your-app-id}.mlkcca.com"); //ここは変えてください
        var ds = milkcocoa.dataStore("chat");

        // pushにコールバック登録1
        ds.on("push", funcA);

        // pushにコールバック登録2
        ds.on("push", funcB);

        // データをpushする
        document.getElementById("send_button").addEventListener("click", function (e) {
            ds.push("push");
        });

        // pushのコールバックを解除する
        document.getElementById("off_button").addEventListener("click", function (e) {
            ds.off("push");
        });

        function funcA() {
            console.log("pushed1");
        }

        function funcB() {
            console.log("pushed2");
        }
    </script>
</body>

</html>
push結果
pushed1
pushed2
解除後push結果
なし

まとめ

同一イベントにコールバックを複数登録すると順に実行されました。たぶん処理は非同期なので、「処理1が終わってから処理2が実行される」わけではないと思いますが。
また、イベントに登録されたコールバックをoffで解除すると、1つ1つ解除されるわけではなく全部一気に解除されました。1つ1つ解除することはできないので、そういうときはoffした後に再登録する等の処理が必要そうです。

hyakuson
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away