Help me understand this snippet of code

#1

Here’s a piece of code that I cannot wrap my head around. It’s from a webextension called tabs, tabs, tabs. Link to the whole extension code is here https://github.com/mdn/webextensions-examples/blob/master/tabs-tabs-tabs/tabs.js

Here’s the part that I don’t understand -

document.addEventListener("click", (e) => {
  function callOnActiveTab(callback) {
    getCurrentWindowTabs().then((tabs) => {
      for (var tab of tabs) {
        if (tab.active) {
          callback(tab, tabs);
        }
      }
    });
}

How does function callOnActiveTab accept it’s own returned value as a parameter to itself? If it’s related to callback functions then please explain that too.

Thanks a lot!

#2

callOnActiveTab does not have an explicit return value. Its sole purpose seems to be calling getCurrentWindowTabs.

#3

I still find it confusing.

1 -> document registers a click.
2-> function callOnActiveTab is executed which accepts callback as it’s parameter,
3 -> getCurrentWindowTabs() returns a list of open tabs in the browser window
4 -> then parameter tabs represents the returned array of open tabs.
5 -> A for loop is performed on array of tabs with each element of the array called tab.
6 -> In the for loop, if tab is active, the callback function will be assigned two parameters. One is the individual tab and the other is list of tabs.

Is that what it’s supposed to mean? Please correct me if I am wrong.

#4