How to call a class from another ,js file?

Question

I am pretty new to this and I am trying to understand classes in javascript. So I followed a tutorial online and everything seemed to work fine and when I tried to do the same like it was in the video I now get an error saying "Uncaught ReferenceError: MyClassName is not defined"

I have 2 files:

app.js
class.js

In class.js

class MyClass {
    constructor(city, state){
        this.city = city;
        this.state = state;

    }
    message(){
        console.log('Hey!');
    }
}

in app.js

const myClass = new MyClass();

const btn = document.getElementById('submit');


btn.addEventListener('click', myClass.message());

The error I get is "Uncaught ReferenceError: MyClass is not defined".

My question is how do I instantiate a class from another file? I know I am doing something wrong but I have no idea what it is.

Update: My HTML doc goes like this.

Please help, thank you for your time.

user_14030881 · Answer

I believe it's giving you that error because you imported the app.js file before class.js file. Try importing class.js first and then it should work. example:

user_14481900 · Answer

Since you linked the app.js is linked before the class.js, it is loaded first, so you can't access MyClass. Switch the lines where you link app.js and class.js, and it should run with no errors.

How to call a class from another ,js file?

2 Answers