Wie importieren und exportieren von javascript-ES6-Klassen

Ich bin neu in javascript und nodejs und ich bin mit diesem Projekt zu entwickeln, meine Fähigkeiten und lernen neue Technologien. Derzeit mein Projekt mit mehreren Klassen, die voneinander abhängen. Die class Dateien sind in verschiedenen Verzeichnissen und ich bin versucht derzeit, export und erfordern Aussagen zu ermöglichen Klassen verwiesen werden, die in anderen Dateien. Ich bin auch mit browserify und watchify zu bündeln, alle Dateien zusammen, um eine Vereinfachung der html-script-tag.

Hier ist Projekt-Layout - (JavaScript-Ordner)

-Base (Folder)
 --Game.js (Class)
 --Player.js (Class)
 --Ball.js (Class)
-Helpers (Folder)
 --Draw.js (Class)
 --Helper.js (Class) 
-GameType (Folder)
 --Game1.js (Class)

Den Klassen, die voneinander abhängig sind, sind wie folgt.

Game is Dependent on 
--Draw.js
--Helper.js
Player and Ball are Dependent on 
--Helper.js
Game1
--Game.js
--Ball.js
--Player.js

Dem Projekt Lasten in einem app.js Datei und erfordert die Datei game1. Im moment bin ich versucht zu testen, und erhalten Sie alle erfordern und export-Anweisungen arbeiten. Derzeit mit in der app.js Datei ich bin in der Lage, erstellen Sie eine game1-Objekt, aber ich bin nicht in der Lage, um den Zugriff auf die Variablen und Methoden mit in es. Ich kann die Konsole an das Objekt und es hat all die richtigen Variablen und Methoden, so ist es die Schaffung der game1-Objekt richtig, aber ich kann nicht den Zugriff auf einen Teil. Ich bin nicht sicher, wenn ich bin derzeit mit dem verlangen und export-Anweisungen falsch, für ES6-Klasse-Schreibweise, oder wenn es gibt ein weiteres problem mit meinem code. Bin ich mit dem verlangen und export-Statements korrekt?

Hier sind die snippets auf die Klassen und die app.js Datei. Einige der Methoden, die
in ein paar Klassen, die abgeschlossen sein müssen, aber ich werde versuchen, fügen Sie in die require-und export-Funktionalität, um die navigation in meinem code besser. Ich hoffe, Sie können helfen, die meinen die Lösung gefunden zu meinem problem.

app.js

const Game1 = require('./GameType/game1.js');

window.onload = function(){
    console.log("Test Started");

    console.log();

    var canvasLocator = document.querySelector("#gameCanvas");
    var canvasContext = canvasLocator.getContext("2d");

    var game1 = new Game1();

    //Prints out the correct object in the console
    console.log(game1);

    game1.draw();
    //Returns an empty array of objects
    //In my test is should return a draw obj 
}

Game1.js

const Game = require('../Base/Game.js');
const Ball = require('../Base/Ball.js');
const Player = require('../Base/Player.js');

class Game1 extends Game{
    constructor(){
        super();
        this.ball = new Ball(400, 300);
        this.player1 = new Player("User", 15, 275, "blue");
        this.player2 = new Player("AI", 775, 275, "blue");
        this.mouseYPos;
    }

    refresh(){
        //Needs to be implemented
    }


    draw(){
        console.log("Super Draw: " + this.ball);
    }


    moveEverything(){
        //Needs to be implemented
    }
}

module.exports = Pong;

Game.js arbeitet als eine Schnittstelle und hat auch Variablen, die notwendig sind, um alle Spiele

'use strict';

const Helper = require('../Helpers/Helper.js');
const Draw = require('../Helpers/Draw.js');

class Game{
    constructor(){
        this.interval;
        this.started = false;
        this.framesPerSecond = 30;
        this.drawObj = new Draw();
        this.helper = new Helper();
    }

    //Each game needs to implement 
    draw(){
        console.log("draw() not implemented in child class!");
    }

    moveEverything(){
        console.log("moveEverything() not implemented in child class!");
    }

    refresh(){
        console.log("refresh() not implemented in child class!");
    }
};

module.exports = Game

Ball

const Helper = require('../Helpers/Helper.js')

class Ball{
    constructor(x, y){
        this.ballX = x;
        this.ballY = y;
        this.ballSpeedX;
        this.ballSpeedY;
        this.ballSpeedXChange;
        this.ballSpeedYChange;
        this.helper = new Helper();
    }

    move(x,y){
        this.ballX = this.ballX + x;
        this.ballY = this.ballY + y;
    }

    increaseSpeed(speedX, speedY){
        this.ballSpeedX = this.ballSpeedX + speedX;
        this.ballSpeedY = this.ballSpeedY + speedY;
    }

    reflectBall(player, drawObj){

    }

    reflect(ptOfContact, paddleSpeed){

    }

    setBallDifficulty(difficulty){
        switch(difficulty){
            case "Easy":
                this.ballSpeedXChange = -1;
                this.ballSpeedYChange = 1;
                break;
            case "Medium":
                this.ballSpeedXChange = -1.5;
                this.ballSpeedYChange = 1.5;
                break;    
            case "Hard":
                this.ballSpeedXChange = -2;
                this.ballSpeedYChange = 2;
                break;
            default:
                console.log("No difficulty Found");
        }
    }
}

module.exports = Ball

Spieler

const Helper = require('../Helpers/Helper.js');

class Player{
    constructor(input, x, y, color){
        //Boolean value for AI or Actual Player
        this.inputType = this.inputType(input);
        this.playerX = x;
        this.playerY = y;
        this.playerSpeed;
        this.playerScore = 0;
        this.paddleWidth = 10;
        this.paddleHeight = 50;
        this.color = color;
        this.helper = new Helper();
    }

    move(drawObj){
        //True: User Input
        //False: AI Input 
        if(this.inputType){
            this.movePlayerInYDir(drawObj);
        }
        else{
            this.movePlayerAIInYDir(drawObj);
        }
    }

    movePlayerInYDir(drawObj){
        let before = this.playerY;
        this.playerY = this.helper.playerInput(drawObj);
        this.playerSpeed = this.playerY - before;
        if((this.playerY + this.paddleHeight) >= (drawObj.getBaseHeight())){
            this.playerY = (drawObj.getBaseHeight() - this.paddleHeight);
        }
    }

    movePlayerAIInYDir(drawObj){
        this.playerSpeed = this.setBotDifficulty("Easy");
        this.playerY = this.playerY + this.playerSpeed;
        if(this.playe2Y <= 0){
            //Hits Top 
            this.playerSpeed = (this.playerSpeed) * -1; 
        }
        else if((this.playerY + this.paddleHeight) >= drawObj.getBaseHeight()){
            //Hits Bottom
            this.playerSpeed = (this.playerSpeed) * -1;
        }
    }

    setAIDifficulty(difficulty){
        switch(difficulty){
            case "Easy":
                //TODO
                break;
            case "Medium":
                //TODO 
                break;
            case "Hard":
                //TODO
                break;
            case "Practice":
                //Unbeatable Mode
                break;
            default:
                console.log("No difficulty Found");
        }
    }

    //Helper
    inputType(type){
        //True: Real Input 
        //False: AI
        switch(type){
            case "User":
                return true;
            case "AI":
                return false;
            default:
                console.log("Type not recognized");
        }
    }

}

module.exports = Player

Helfer

class Helper{
    constructor(){
        this.gameType;
        this.canvasLocator = document.querySelector("#gameCanvas");
        this.canvasContext = this.canvasLocator.getContext("2d");
        this.mouseXPos;
        this.mouseYPos;
    }

    getMouseYPos(canvas, evt) {
        var rect = canvas.getBoundingClientRect();
        return (evt.clientY - rect.top);

    }

    playerInput(drawObj){
        let c = this.canvasLocator;
        let helper = this;
        //let game = this;
        //let mouseYPos;
        //console.log(game);
        c.addEventListener("mousemove", function(evt){  
                                            helper.mouseYPos = helper.getMouseYPos(c, evt);                                
                                        } 
                                      , false);  
        //console.log(game.mouseYPos); 
        return helper.mouseYPos;     
    }

    change(speed){
        //Ball Function for reflection 
        if(speed > 8 || speed < -8){
            return 2;
        }
        return (Math.abs(1/8 * speed) + 1);
    }

    randomIntNumber(min, max){
        min = Math.ceil(min);
        max = Math.floor(max);
        return Math.floor(Math.random() * (max - min)) + min;
    }

    randomSpeed(){
        if(this.randomIntNumber(0, 100) % 2 == 0){
            return this.randomIntNumber(-7, -9);
        }
        else{
            return this.randomIntNumber(7, 9);
        }
    }

    randomNumber(min, max){
        return (Math.random() * (max - min)) + min;
    }
}

module.exports = Helper

Danke für die Hilfe.