RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.mozilla.org/en-US/docs/Web/API/MessageEvent below:

MessageEvent - Web APIs | MDN

Constructor

MessageEvent(): Creates a new MessageEvent.

Instance properties

This interface also inherits properties from its parent, Event.

MessageEvent.data Read only: The data sent by the message emitter.
MessageEvent.origin Read only: A string representing the origin of the message emitter.
MessageEvent.lastEventId Read only: A string representing a unique ID for the event.
MessageEvent.source Read only: A MessageEventSource (which can be a WindowProxy, MessagePort, or ServiceWorker object) representing the message emitter.
MessageEvent.ports Read only: An array of MessagePort objects containing all MessagePort objects sent with the message, in order.

Instance methods

This interface also inherits methods from its parent, Event.

initMessageEvent() Deprecated: Initializes a message event. Do not use this anymore â use the MessageEvent() constructor instead.

Examples

In our Basic shared worker example (run shared worker), we have two HTML pages, each of which uses some JavaScript to perform a calculation. The different scripts are using the same worker file to perform the calculation â they can both access it, even if their pages are running inside different windows.

The following code snippet shows creation of a SharedWorker object using the SharedWorker() constructor. Both scripts contain this:

const myWorker = new SharedWorker("worker.js");

Both scripts then access the worker through a MessagePort object created using the SharedWorker.port property. If the onmessage event is attached using addEventListener, the port is manually started using its start() method:

When the port is started, both scripts post messages to the worker and handle messages sent from it using port.postMessage() and port.onmessage, respectively:

[first, second].forEach((input) => {
  input.onchange = () => {
    myWorker.port.postMessage([first.value, second.value]);
    console.log("Message posted to worker");
  };
});

myWorker.port.onmessage = (e) => {
  result1.textContent = e.data;
  console.log("Message received from worker");
};

Inside the worker we use the onconnect handler to connect to the same port discussed above. The ports associated with that worker are accessible in the connect event's ports property â we then use MessagePort start() method to start the port, and the onmessage handler to deal with messages sent from the main threads.

onconnect = (e) => {
  const port = e.ports[0];

  port.addEventListener("message", (e) => {
    const workerResult = `Result: ${e.data[0] * e.data[1]}`;
    port.postMessage(workerResult);
  });

  port.start(); // Required when using addEventListener. Otherwise called implicitly by onmessage setter.
};

Specifications Browser compatibility

Loadingâ¦