Class is undefined in IE8

Question

I have stupidly decided to support IE8 in my latest project, something which will no doubt go down in history as the dumbest idea of my life.

So the most fundamental problem I'm running into is that my main class variable is undefined. What I mean is I have a prototype set up in a file general.js that looks a bit like this:

var generalClass;

// jQuery Object
var $ = jQuery; 

$(document).ready(function() {

    // A general class for a general file.
    generalClass = function() {

    }

    generalClass.prototype = {

    }


    new generalClass();     


});

So the generalClass variable is filled up with my prototype/etc. I then include this in the head of my document and later on I call upon a function in that generalClass for something else, a bit like this:

<script type="text/javascript" src="general.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $.ajax({
        type: 'POST', 
        url: ..., 
        data: {

        }, 
        success : function(data) {
            // CALL MY FUNCTION:    
            generalClass.prototype.myFunction();

        }


    }
});
</script>

In every browser, from IE9 to Chrome this works. In IE8 this does not work, and generalClass is undefined. Why is it doing this to me?

Answer 1

I am not sure where you learned that pattern, but it should be more like this:

var generalClass;

// jQuery Object
//var $ = jQuery;  <-- makes no sense $ should be jQuery already

$(document).ready(function() {

    function GeneralClass() {}
    GeneralClass.prototype = {
        myFunction: function () {
            alert("x");
        }
    };

    generalClass = new GeneralClass();

});

and when you call it

generalClass.myFunction();