什么是 brocast
brocast 是一个基于 Node.js 的前端事件管道，可以用于在不同的浏览器窗口之间广播事件。它可以跨浏览器、跨 tab、跨窗口、甚至是跨设备。
安装
安装 brocast 可以使用 npm 命令：
npm install brocast --save
使用
最简单的使用方式是在需要使用事件的代码中引入 brocast：
-- -------------------- ---- ------- ----- ------- - ------------------- -- ---- ------------------------------ ------ -- - -------------------- ------ --- -- ---- ------------------------------ - ----- ------ ------ ---
以上代码中，我们使用 brocast 包中的 subscribe 方法来订阅一个名为 'eventName' 的事件，并在回调函数中处理接收到的数据。然后使用 broadcast 方法来发送 'eventName' 事件和数据。
按命名空间订阅/广播事件
在真正的应用场景中，我们经常需要使用多个事件，此时可以采用按命名空间订阅/广播事件的方式，可以大大提高代码的可维护性。参考代码如下：
-- -------------------- ---- ------- ----- ------- - ------------------- -- ---- ----- --- ----- ---------- - ----------------------- --------------------------------- ------ -- - --------------- --- ---- ------ --- -- ---- ------ --- ----- ----------- - ------------------------ ---------------------------------- ------ -- - --------------- ---- ---- ------ --- -- -- --- -- --------------------------------- - ----- ------ ---- --- -- -- ---- -- ---------------------------------- - ----- ------ ----- ---
以上代码中，我们通过使用 channel 方法来创建了两个命名空间，分别是 'app' 和 'pure'。然后我们分别在不同的命名空间中订阅了名为 'eventName' 的事件，并且使用同样的名字来广播事件和数据。
浏览器中使用
brocast 不仅可以在 Node.js 中使用，还可以在浏览器端使用。我们可以使用 brocast-client 这个包来在浏览器中使用 brocast。安装方法如下：
npm install brocast-client --save
然后在 html 中引入 brocast-client 脚本：
<script src="/node_modules/brocast-client/dist/brocast-client.min.js"></script>
然后在 js 中创建 brocast 实例，并使用 subscribe、broadcast 等方法即可。
-- -------------------- ---- ------- -- --- ------- -- ----- ------- - --- ---------------- -- ---- ------------------------------ ------ -- - -------------------- ------ --- -- ---- ------------------------------ - ----- ------ ------ ---
结语
上述是 brocast 的基本使用方法和示例代码，通过学习可以发现 brocast 具备跨浏览器、跨 tab、跨窗口、甚至是跨设备的广播事件能力，非常适用于大型的前端应用中。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066c8accdc64669dde5242