I'm rewriting my JS code to make it more clear and precise. I define one module in namespace and not able to pass the same variable in that bind function, see below code:
// Gmap Autocomplete initialization and reset function
var gMapPlace = gMapPlace || {};
gMapPlace.geoAutocomplete = (function(){
var detail = {
searchEle : null,
autocompleteEle : null,
autocompleteLsr : null,
init : function(searchEle){
this.searchEle = searchEle;
this.autocompleteEle = new google.maps.places.Autocomplete(this.searchEle);
this.autocompleteLsr = google.maps.event.addListener(this.autocompleteEle, 'place_changed', function () {
var data = gMapPlace.geoAutocomplete.data;
// ################################
var place = data.autocompleteEle.getPlace(); // any way to reference simple 'this.autocompleteEle' here
// ################################
var address = place.formatted_address;
var latitude = place.geometry.location.lat();
var longitude = place.geometry.location.lng();
var mesg = "Address: " + address;
mesg += "\nLatitude: " + latitude;
mesg += "\nLongitude: " + longitude;
alert(mesg);
});
},
reset : function(){
if(isNotBlank(this.searchEle)){
google.maps.event.clearInstanceListeners(this.searchEle);
}
}
};
return{
data : detail
};
}());
As per the above code, I've a bind function at this.autocompleteLsr which runs when that particular event happen, when I directly use var place = this.autocompleteEle.getPlace(), then it gives undefined error run-time. Now in order to work I code it to get the value by iterating over the namespace object like
var data = gMapPlace.geoAutocomplete.data;
// ################################
var place = data.autocompleteEle.getPlace();// any way to reference simple 'this.autocompleteEle' here
// ################################
Is there any other way to reference module variables at run-time or that's the only way here.
arrowfunction, which will allow you to use the enclosuresthisinside the function as arrow functions do not generate their ownthis. You could also just usedetail.autocompleteElein the function as by that time it will have a value filled.this, at the runtime when that event happen how can I use variablegMapPlace.geoAutocomplete.data.autocompleElewithout iterating through like because this function is initialized within this namespace context, why can't I directly use the variable likethis.autocompleteEle.eventHandlerFunction.bind( gMapPlace.geoAutocomplete.data )you should be able to usethisinside theeventHandlerFunction. For some reason I feel you might have overcomplicated this a bit.thiskeyword. but i just wanted to sure that Is there any other way we can refer this variable, other then what I did. I'm a bit confuse like is it the right way or not which I did.getterfor this?data = { get autoCompletelEle(){ /* code to get element, return element */ }? But if the function is asynchornous, you won't be able to do that.