删除其他事件侦听器功能中定义的弹出窗口

我的事件侦听器函数i根据variable的长度打开弹出窗口的数量，该变量codedCities是动态变化的。此功能运行良好，但问题是删除了弹出窗口。开启，'mouseout'我希望所有打开的弹出窗口'mouseover'都关闭。

item.addEventListener('mouseover', function() {

          for (var i in codedCities) {

 var  popupB = new mapboxgl.Popup({
                offset: [0, -10],
                closeButton: false,
                closeOnClick: true,
                anchor: 'top-left'
            });

              popupB.setLngLat(codedCities[i].geometry.coordinates)
              .setHTML('<div>' + codedCities[i].properties.city + '</div>')
              .addTo(map);

        }

  });

使用Mapbox GL，mapboxgl.Popup将为每个功能创建一个新实例，这意味着必须删除相同数量的弹出窗口。到目前为止，我已经尝试过：

    item.addEventListener('mouseout', function() {

      if (popupB){
          popupB.remove();
        } else {
          console.log("no more popups!")
        }
    });

但这是行不通的，因为这popupB是在先前的函数中定义的局部变量。然后，我尝试popupB在上一个函数中使用定义为全局变量，window.popupB但是仅删除了一个实例popupB，而不是全部删除。然后，我尝试在弹出式变量名称中添加数字[i]，并使用window["popup" + i] = new mapboxgl.Popup

        item.addEventListener('mouseout', function() {

        var step;
        for (step = 0; step < codedCities.length ; step++) {    
        window["popup" + step].remove();

          }
      });

但这什么也没显示。我想知道是否有解决此问题的已知方法。

如何在mouseover函数中定义和创建弹出窗口，然后在函数中删除那些完全相同的弹出窗口mouseout？

有没有一种方法可以mouseout 在mouseover功能中包含我想要的内容？