ReferenceError: google is not defined / Geocoding API

Question

I tried to create geocoding function (geocoding API), it keeps returning google is not defined, I already changed the link according to this answer but it didn't work :( It bugged at geocoder = new google.maps.Geocoder();

JS:

geocoder = new google.maps.Geocoder();

function address() {
    //In this case it gets the address from an element on the page, but obviously you  could just pass it to the method instead
    for (i = 0; i < index.length; i++) {
        var address = index[i].Origin;
        console.log(address)
        geocoder.geocode({
            'address': address
        }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                //In this case it creates a marker, but you can get the lat and lng from the location.LatLng
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
            } else {
                alert('Geocode was not successful for the following reason: ' + status);
            }
        });
    }
}

link:

<script src="https://maps.google.com/maps/api/js?key=AIzaSyCNpeRgwCQoHIlLn-X8TIB9SnO8iLPt808&callback=initMap"
async defer></script>

Sorry if the question is duplicated, I tried almost everything (also outside stack) and yeah nothing changes.

Answer 1

Put any code that depends on the API (starts with google.maps.) in the initMap function or load the API synchrounously (remove async defer and &callback=initMap from the script URL)

Answer 2

Try using window.google.maps.Geocoder() instead of google.maps.Geocoder()