Question

我在游戏中使用ES6课程。我有两个问题：

问题1）我实例化BattleMode和ExplorationMode的两个单例类并传入初始参数type。

即使我是console.logging explorationMode（ExplorationMode的一个实例），它也会显示Class BattleMode类型exploration。这是为什么？

问题2）我正在使用gulp和babel将脚本编译成main.js。上述ExplorationMode和BattleMode都继承自父类Mode。 Gulp运行modes/文件夹并按顺序添加到main.js。

显然ES6关心JavaScript的顺序，这意味着如果BattleMode是Mode的孩子，那么它会说它无法找到它的父级。

未捕获的TypeError：超级表达式必须为null或函数，而不是未定义的

这会强制重命名mode.js，使其首先出现在文件夹顺序中。那非常黑客。如果我添加A_mode，错误就会消失。

除了重命名或指定gulp中的每个父级出现在其子级之前，还有更好的解决方案吗？

否则，我可以使用Objects：

var Mode = Mode || {};

Mode.BattleMode = Mode.BattleMode || {
    doThing : function () {
         ...

问题1：

class StateManager {
    constructor(type) {
        if (!stateManagerInstance) {
            stateManagerInstance = this;
        }
        this.type = type;
        const battleMode = new BattleMode('battle');
        const explorationMode = new ExplorationMode('exploration');

        console.log('MODE: ', explorationMode); // Wrong
        ...

控制台输出：

模式：类BattleMode {类型：＆＃34;探索＆＃34; ，screenState：＆＃34;战斗＆＃34; }

模式：

/*
  Define as Singleton
 */
let modeInstance = null;

class Mode {
    constructor() {
        if (!modeInstance) {
            modeInstance = this;
        }

        return modeInstance;
  }

}

ExplorationMode：

/*
  Define as Singleton
 */
let explorationInstance = null;

class ExplorationMode extends Mode {
    constructor(type) {
        super(type);

    this.type = type;

        if (!explorationInstance) {
            explorationInstance = this;
        }

    this.screenState = '';

        return explorationInstance;
  }

BattleMode：

/*
  Define as Singleton
 */
let battleInstance = null;

class BattleMode extends Mode {
    constructor(type) {
        super(type);

    this.type = type;

        if (!battleInstance) {
            battleInstance = this;
        }

    this.screenState = '';

        return battleInstance;
  }

问题2：

咕嘟咕嘟：

gulp.task('build-dev', function() {
    gulp.run('scripts');
  gulp.watch('js/**/*.js', function() {
    gulp.run('scripts');
  });
});

gulp.task('scripts', function() {
    return gulp.src([
            'js/**/*.js',
        ])
        .pipe(babel({
            presets: ['es2015']
        }))
        .pipe(concatJs('main.js'))
        .pipe(gulp.dest('build/js'));
});

Answer 1

这是单例可以反模式的一个例子。它提供额外的复杂性而没有实际的好儿童班甚至不能从继承中受益。

由于ExplorationMode和Mode都继承自Mode，因此首先评估modeInstance构造函数。第一个实例保存到BattleMode。由于BattleMode首先被实例化，所以它是{{1}}的一个实例，无论子构造函数发生什么。

在这种情况下，许多其他单例类应该只用普通对象替换。

在ES6中导致错误的类的实例化和排序

1 个答案: