title: Calling an object function gets undefined when run inside a click event
body: <p>From my object PolygonExtend I can trigger some inner actions like show and hide. Those actions seem to work fine. However, when I run the same actions inside a click event (google.maps.event.addDomListener) I get a "TypeError: this.name is undefined". How can I get it to work?</p>
  
  <p><a href="https://jsfiddle.net/evb4kmhw/1/" rel="nofollow noreferrer">jsFiddle here</a></p>
  
  <pre><code>var mapOptions = {
          center: new google.maps.LatLng(4.7102000, -74.0308118),
          zoom: 18,
          mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  var coords = [
    {lat: 4.711177836295898, lng: -74.03219819068909},
    {lat: 4.710354506576612, lng: -74.03219819068909},
    {lat: 4.710354506576612, lng: -74.03176367282867},
    {lat: 4.711177836295898, lng: -74.03176367282867}
  ];
  
  function PolygonExtend(name, path) {
          //this.name = name;
          this.path = path;
          this.name =  new google.maps.Polygon({
                  path: this.path,
          });
  
          this.show = function() {
              this.name.setMap(map);
          };
          this.hide = function() {
              this.name.setMap(null);
          };
  
          return this.name.setMap(map); // makes Polygon show when instantiated
  }
  
  a = new PolygonExtend('a', coords); // works and renders Polygon
  
  a.hide(); // works, hides Polygon
  a.show(); // works, makes Polygon visible again
  
  var btn = document.getElementById('btn');
  google.maps.event.addDomListener(btn, 'click', a.hide); // TypeError: this.name is undefined
  </code></pre>