Javascript: ReferenceError: MyClass is not defined

Question

This is very basic. I try to instantiate a Class defined in an external .js file embedded. The code of the .js is simply this.

(function() {
  var MyClass;

  MyClass = (function() {

    function MyClass() {}

    MyClass.prototype.name = function(name) {};

    return MyClass;

  })();

}).call(this);

And the HTML is this

<!DOCTYPE html>
<html>

  <head>
    <title>Sample Page</title>
    <script src="file.js" type="text/javascript"></script>
  </head>

  <body>

  </body>
</html>

If I try on the console to instantiate the class but I see a ReferenceError: MyClass is not defined:

var myVar
myVar = new MyClass
> ReferenceError: MyClass is not defined

If I try to call MyClass directly from console I get the same error

> ReferenceError: MyClass is not defined

I'm sure I missing something terrible obvious here but yet I can figure it out what.

Updated: To create the javascript coded I'm using CoffeScript, the code is simply this.

class MyClass
  acc: (name) ->

The proposed answers codes when converted back to CoffeScript using http://js2coffee.org render into a different code and it still doesn't work. Wonder If there's a hint on CoffeScript to eject MyClass from local scope to the outer scope.

David G · Accepted Answer · 2012-11-17T22:08:26.417

5

My class is defined inside a closure. Rather what you want to do is "eject" it into the outer scope by setting it to the window object:

(function() {

    var myClass = ...

    window.myClass = myClass;

}).call( this );

Update: It seems you wanted it in CoffeeScript. Here you go:

(->

  myClass = (->
    myClass = ->
    myClass::name = (name) ->

    myClass
  )()

  window.myClass = myClass

).call this

JSBin Demo

edited Nov 17 '12 at 22:08

answered Nov 17 '12 at 21:44

David G

94,763
41
167
253

@Martin So you're saying you want the same thing, only in Coffescript? – David G Nov 17 '12 at 21:56
Your proposed solution broke somehow when converted to CoffeScript. Wondering if theres a specific method on CoffeScript for this. Otherwise other than nasty at sight It still not work (end up rendering a different code). – Martin Nov 17 '12 at 21:57
@Martin I'm not familiar with CoffeeScript, I wouldn't know. Though I used the site you referenced and entered the code in. It doesn't seem to do anything wrong. See here -- http://paste.ubuntu.com/1366202/ – David G Nov 17 '12 at 22:03

Minko Gechev · Answer 2 · 2012-11-17T22:01:23.550

MyClass is defined into the local scope of the self-invoking function. You can try to initialize MyClass outside of the self-invoking function:

var MyClass;
(function() {

  MyClass = (function() {

    function MyClass() {}

    MyClass.prototype.name = function(name) {};

    return MyClass;

  })();

}).call(this);

Another thing you can do is:

(function() {
  this.MyClass = (function() {

    function MyClass() {}

    MyClass.prototype.name = function(name) {};

    return MyClass;

  })();

}).call(window);

In the code above you're simply invoking the anonymous function with the window context and setting value to the MyClass window's property (which makes MyClass global).

Another solution (which in my opinion is more unclear) is:

(function() {

  window.MyClass = (function() {

    function MyClass() {}

    MyClass.prototype.name = function(name) {};

    return MyClass;

  })();

}).call(this);

The only difference is that you explicitly say that the property MyClass of window will be equals to the result of the execution of the function.

Your CoffeeScript probably could be something like:

MyClass = undefined
(->
  MyClass = (->
    MyClass = ->
    MyClass::name = (name) ->

    MyClass
  )()
).call this

I've posted a sample coffeescript – Minko Gechev Nov 17 '12 at 22:02 — Minko Gechev, Nov 17 '12 at 22:02

Javascript: ReferenceError: MyClass is not defined

2 Answers2

Linked