How to access JavaScript module pattern in my case?

Question

I have defined the following module in MyModule.js:

MyModule.js:

MyModule = {

    controller: {
       paintCar: function(color){
            //PAINTING PROCESS
       }
    },

    tester: {
        ...
    },

};

Then, I have another javascript file, other.js:

other.js:

MyModule.controller.paintCar('red');

My index.html

<body>
    <script scr="MyModule.js"></script>
    <script src="other.js"></script>
  </body>

All these files are put under WebContent directory of Eclipse Dynamic Web Project.

In other.js when I try to run the above code, I got error "MyModule is not defined". Why?

Quentin · Accepted Answer · 2011-04-15 10:41:12Z

1

You misspelt src here: <script scr="MyModule.js">. This would have been picked up by basic automated QA testing.

(Original answer before the theory was confirmed) Presumably, because you aren't loading the script files properly. Since you haven't shown us the code that does that (or even told us what environment you are using) it is hard to say exactly how you went wrong.

Assuming you are using client side JS in a webpage, your code should look something like:

<script src="MyModule.js"></script>
<script src="other.js"></script>

Order is significant. End tags are mandatory. Self-closing tag syntax is unacceptable (unless the document is served as application/xhtml+xml)

(This uses HTML 5 syntax. For HTML 4 / XHTML 1, add a type attribute. For HTML 3.2, add a language attribute)

edited Apr 15, 2011 at 10:41

answered Apr 15, 2011 at 10:30

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Quentin Over a year ago

It is the HTML that causes the scripts to be loaded, and you haven't shown us any of that. (he said, in response to a comment that has since been deleted)

Mellon Over a year ago

I updated my post. I have loaded the js files in my index.html

Quentin Over a year ago

Updated answer. See first line.

Mellon Over a year ago

By the way, in JS, is the module name and the js file name must be the same or not?

T.J. Crowder Over a year ago

@Mellon: The filename is not related to the "module" name at all. JavaScript doesn't have modules, just objects.

|

T.J. Crowder · Accepted Answer · 2011-04-15 10:44:05Z

1

You haven't mentioned your environment, but generally you have to ensure that the JavaScript in MyModule.js is executed before the JavaScript in other.js, because you need MyModule.js to set up the MyModule variable.

How you do it will vary by environment. In a web browser, you'd do that by putting in two script tags, first one for MyModule.js then the one for other.js (although frequently, for use on websites, you want to have a build process that combines your scripts into a single file to minimize HTTP requests). In NodeJS, there's the whole require mechanism.

Update based on your edit:

Looks like a typo:

<body>
    <script scr="MyModule.js"></script>
             ^^-- here, they're transposed
    <script src="other.js"></script>
</body>

If that typo isn't really in your file, then look to see that the files are where the web server expects, that the web server isn't being thrown by capitalisation, that sort of thing. Fundamentally, that's correct.

edited Apr 15, 2011 at 10:44

answered Apr 15, 2011 at 10:29

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

2 Comments

Mellon Over a year ago

I updated my post. I have loaded the js files in my index.html

Mellon Over a year ago

Yes, it is a typo. Thank you:)

Collectives™ on Stack Overflow

How to access JavaScript module pattern in my case?

2 Answers 2

6 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related