javascript - Watch.js 仅在某些条件下不观看？

Question

我正在 Node.js 中开发一个基于 express-ws 的应用程序，并且我在 app.ws 路由中使用 Watch.js 观察器。打开 WebSocket 时，将使用 app.ws 语句中定义的回调函数对全局对象进行监视。然后在 ws.on('close', ... 函数中，我使用相同的对象和回调函数调用 unwatch。(参见代码片段 A)

这适用于具有简单 bool 条目的简单 JS 对象(请参阅代码片段 A 中的 stat_A)。然而，我很快就会有多个持有不同状态的对象，我想将它们全部放入一个新的 JS 对象中。所以这是一个内部有一堆对象的对象。

代码段 B 是一个应该与代码段 A 等效的示例。但是，似乎在 WebSocket 关闭后，unwatch 不知何故不采取，并且当stat['A'] 已更新，程序尝试通过关闭的 WebSocket 发送它并崩溃。

我被难住了。是什么导致unwatch失败？

编辑:我通过将 watch(stat, 'A', send_stat) 更改为 watch(stat['A'], send_stat) 使代码片段 B 正常工作，并以同样的方式更改unwatch。请参阅代码片段 C。现在，我无法取消观看主 stat 列表，请参阅代码片段 D。

代码片段 A(stat_A 在其他地方更新):

const express = require('express');
const app = express();
const expressWs = require('express-ws')(app);
const watchjs = require('watchjs');

const port = 1338;

var stat_A = {'1': true, '2': false, '3' : false};

app.ws(
    '/stat_A',
    (ws, req) => {
        function send_stat() {
            ws.send(JSON.stringify(stat_A));
        }

        send_stat();
        // Setup watchers
        watchjs.watch(stat_A, send_stat);

        ws.on(
            'close',
            () => {
                // Stop watchers
                watchjs.unwatch(stat_A, send_stat);
            }
        );
    }
);

app.listen(
    port,
    () => {
        console.log(`Listening (HTTP) on port ${port}!`);
    }
);

代码片段 B(stat['A'] 在其他地方更新):

const express = require('express');
const app = express();
const expressWs = require('express-ws')(app);
const watchjs = require('watchjs');

const port = 1338;

var stat = {
    'A': {'1': true, '2': false, '3' : false}
};

app.ws(
    '/stat_A',
    (ws, req) => {
        function send_stat() {
            ws.send(JSON.stringify(stat['A']));
        }

        send_stat();
        // Setup watchers
        watchjs.watch(stat, 'A', send_stat);

        ws.on(
            'close',
            () => {
                // Stop watchers
                watchjs.unwatch(stat, 'A', send_stat);
            }
        );
    }
);

app.listen(
    port,
    () => {
        console.log(`Listening (HTTP) on port ${port}!`);
    }
);

代码片段 C(B 已修复):

const express = require('express');
const app = express();
const expressWs = require('express-ws')(app);
const watchjs = require('watchjs');

const port = 1338;

var stat = {
    'A': {'1': true, '2': false, '3' : false}
};

app.ws(
    '/stat_A',
    (ws, req) => {
        function send_stat() {
            ws.send(JSON.stringify(stat['A']));
        }

        send_stat();
        // Setup watchers
        watchjs.watch(stat['A'], send_stat);

        ws.on(
            'close',
            () => {
                // Stop watchers
                watchjs.unwatch(stat['A'], send_stat);
            }
        );
    }
);

app.listen(
    port,
    () => {
        console.log(`Listening (HTTP) on port ${port}!`);
    }
);

代码片段 D(与 B 相同的问题，在 C 中修复不适用):

const express = require('express');
const app = express();
const expressWs = require('express-ws')(app);
const watchjs = require('watchjs');

const port = 1338;

var stat = {
    'A': {'1': true, '2': false, '3' : false}
};

app.ws(
    '/stat',
    (ws, req) => {
        function send_stat() {
            ws.send(JSON.stringify(stat));
        }

        send_stat();
        // Setup watchers
        watchjs.watch(stat, send_stat);

        ws.on(
            'close',
            () => {
                // Stop watchers
                watchjs.unwatch(stat, send_stat);
            }
        );
    }
);

app.listen(
    port,
    () => {
        console.log(`Listening (HTTP) on port ${port}!`);
    }
);

Answer 1

所以最终的答案如下。

const express = require('express');
const app = express();
const expressWs = require('express-ws')(app);
const watchjs = require('watchjs');

const port = 1338;

var stat = {
    'A': {'1': true, '2': false, '3' : false}
};

app.ws(
    '/stat',
    (ws, req) => {
        function send_stat() {
            ws.send(JSON.stringify(stat));
        }

        send_stat();
        // Setup watchers
        Object.keys(stat).forEach((key) => {
            watchjs.watch(stat[key], send_stat);
        })

        ws.on(
            'close',
            () => {
                // Stop watchers
                Object.keys(stat).forEach((key) => {
                    watchjs.unwatch(stat[key], send_stat);
                })
            }
        );
    }
);

app.ws(
    '/stat/A',
    (ws, req) => {
        function send_stat() {
            ws.send(JSON.stringify(stat['A']));
        }

        send_stat();
        // Setup watcher
        watchjs.watch(stat['A'], send_stat);

        ws.on(
            'close',
            () => {
                // Stop watcher
                watchjs.unwatch(stat['A'], send_stat);
            }
        );
    }
);

app.listen(
    port,
    () => {
        console.log(`Listening (HTTP) on port ${port}!`);
    }
);