Question

我正在尝试在ES6中运行快速应用程序。我正在使用以下工作流程：

使用以下gulp任务（在.babelrc中使用"es2015"和"stage-0"预设）将ES6透明化为ES5：

import gulp from 'gulp';
import gulpBabel from 'gulp-babel';
import sourcemaps from 'gulp-sourcemaps';

gulp.task('babel', () => {
    gulp.src([
            'someClass.js',
            'app.js'
        ], {base: './', dot: false})
        .pipe(sourcemaps.init())
        .pipe(gulpBabel())
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('./dist'));
});

这似乎工作正常。

运行node dist/app.js。

以下代码位于someClass.js：

export default class SomeClass {

    someMethod() {
        return 1 + 1;
    }
}

最后，以下代码位于app.js：

import SomeClass from './someClass';

//express config

console.log(SomeClass);
console.log(SomeClass.someMethod);

哪些日志：

[Function: SomeClass]
undefined

以下是相关的转换代码：

DIST / app.js

var _someClass = require('./someClass');

var _someClass2 = _interopRequireDefault(_someClass);

console.log(_someClass2.default);
console.log(_someClass2.default.someMethod);

DIST / someClass.js

var SomeClass = function () {
    function SomeClass() {
        _classCallCheck(this, SomeClass);
    }

    _createClass(SomeClass, [{
        key: "someMethod",
        value: function someMethod() {
            return 1 + 1;
        }
    }]);

    return SomeClass;
}();

exports.default = SomeClass;

为什么someMethod未定义？

Answer 1

因为someMethod是一个实例方法。您需要使用new实例化该类以使用该方法。

const something = new SomeClass();
something.someMethod();

如果要在不实例化类的情况下使用该方法，可以将其定义为静态方法。

export default class SomeClass {

    static someMethod() {
        return 1 + 1;
    }
}

SomeClass.someMethod();

在上面的评论中，您说您想将其用作回调。要将其用作回调，如果在方法中使用this关键字，则可能需要将上下文绑定到方法。否则，当this关键字被称为回调函数时，var something = new SomeClass(); element.addEventListener('click', something.someMethod.bind(something)); // or element.addEventListener('click', (event) => something.someMethod(event));关键字不会指向该实例。

conda create -n cv2env opencv

Node + ES6 + Babel未定义类方法

1 个答案: