Joakim Wimmerstedt
Joakim Wimmerstedt

Reputation: 699

"TypeError: Undefined is not a function" (Passing an object from a dependency) in RequireJS

So I'm trying to learn RequireJS for work. It seemed easy enough, but then I ran into a problem. How do I pass on an object from within one of the dependencies?

The code below returns "TypeError: Undefined is not a function" for the new variable. I tried logging the typeof GoogleMap, but it also returns undefined.

What is the correct way of doing this?

Main.js

require(['test', 'geo', 'googlemaps'], function (GoogleMap) {
        var map = new GoogleMap();
});

googlemaps.js

define(function() {

        function GoogleMap(){

           var i = 0;
           var userMarkers = [];

           var map = {}

           this.initialize = function(lat,lng){
                map = getMap(lat,lng);
           }

           var getMap = function(lat,lng){
               var asldOptions = {
                     zoom: 4,
                     center: new google.maps.LatLng(59, 18),
                     mapTypeId: google.maps.MapTypeId.ROADMAP
                 };

               map = new google.maps.Map(document.getElementById("map-canvas"), asldOptions);

               return map;
           }
        }
    }
);

Edit: I should add that it works fine when i remove the 'define' line at the top and the corresponding brackets at the bottom of googlemaps.js.

Upvotes: 0

Views: 782

Answers (2)

Sujesh Arukil
Sujesh Arukil

Reputation: 2469

require(['test', 'geo', 'googlemaps'], function (GoogleMap) {

change that to

require(['test', 'geo', 'googlemaps'], function (test, geo, GoogleMap) {

and try again.

Your GoogleMap is not mapped to googlemaps script, but to test. it is in the order which you specify your dependencies.

Either way, my previous answer still stands. That is how you should be returning the function in your googlemaps.js file.

Hope that helps. Suj

Upvotes: 0

Sujesh Arukil
Sujesh Arukil

Reputation: 2469

define(function() {

    var GoogleMap  = function(){

       var i = 0;
       var userMarkers = [];

       var map = {}

       this.initialize = function(lat,lng){
            map = getMap(lat,lng);
       }

       var getMap = function(lat,lng){
           var asldOptions = {
                 zoom: 4,
                 center: new google.maps.LatLng(59, 18),
                 mapTypeId: google.maps.MapTypeId.ROADMAP
             };

           map = new google.maps.Map(document.getElementById("map-canvas"), asldOptions);

           return map;
       }
    }

    return GoogleMap;

  }
);

Upvotes: 1

Related Questions