d3-dispatch module overview
d3-dispatch separates concerns using named callbacks and custom event dispatchers. It provides dispatch creation, event listener registration, dispatcher copying, and event dispatching via call or apply methods.
d3-dispatch
8 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.
d3.dispatch() creates a new dispatch for event types
d3.dispatch(...types) creates a new dispatch object for the specified event types. Each type is a string such as "start" or "end". For example, const dispatch = d3.dispatch("start", "end") creates a dispatch for start and end events.
dispatch.on() registers, removes, or gets callbacks
dispatch.on(typenames, callback) adds, removes, or gets the callback for the specified typenames. If a callback function is specified, it is registered for the specified typenames. If a callback was already registered for the typenames, the existing callback is removed before the new callback is added. If callback is not specified, returns the current callback for the specified typenames. The typenames is a string such as "start" or "end.foo", where the optional name after a period allows multiple callbacks for the same type (e.g., "start.foo" and "start.bar"). Multiple typenames can be specified separated by spaces (e.g., "start end" or "start.foo start.bar"). To remove all callbacks for a given name foo, use dispatch.on(".foo", null).
dispatch.copy() returns a copy of the dispatch
dispatch.copy() returns a copy of this dispatch object. Changes to the original dispatch do not affect the returned copy and vice versa.
dispatch.call() invokes callbacks with a context and arguments
dispatch.call(type, that, ...arguments) invokes each registered callback for the specified type, passing the callback the specified arguments, with that as the this context. This works like function.call(). For example, dispatch.call("start", {about: "I am a context object"}, "I am an argument") calls all start callbacks with the object as this context and the string as an argument.
dispatch.apply() invokes callbacks with a context and arguments array
dispatch.apply(type, that, arguments) invokes each registered callback for the specified type, passing the callback the specified arguments array, with that as the this context. This works like function.apply(). For example, selection.on("click", function() { dispatch.apply("custom", this, arguments); }) dispatches custom callbacks after handling a native click event, preserving the current this context and arguments.
Dispatch allows named callbacks on the same type
A dispatch typename can include an optional name after a period. For example, dispatch.on("start.foo", callback1) and dispatch.on("start.bar", callback2) register two different callbacks for start events. This allows multiple callbacks to be registered for the same event type and identified by their names, making it easy to remove or replace them individually.
Dispatch example: creating and using a dispatch
Example of creating and using a dispatch: const dispatch = d3.dispatch("start", "end"); dispatch.on("start", callback1); dispatch.on("start.foo", callback2); dispatch.on("end", callback3); dispatch.call("start");