Question

我有一个现有项目（在浏览器中完全运行，没有服务器端组件），它使用RequireJS来管理依赖项。以前我一直在定义＆＃34;类＆＃34; （包括继承）是这样的：

define([
    'jquery',
    'classes/SomeParentClass',
], function($, SomeParentClass){

    function ThisClass(data){

        SomeParentClass.call(this, data);

        this.init = function(data){
            //Do stuff
        }

        this.init(data);
    }

    ThisClass.prototype = Object.create(SomeParentClass.prototype);
    ThisClass.prototype.constructor = ThisClass;

    return ThisClass;

});

然后当我想将它包含在其他类中时，我会使用标准的RequireJS define / require语法：

define(['classes/ThisClass'], function(ThisClass){
    var fooInstance = new ThisClass(fooData);
});

我想尝试一下＆＃34;班级＆＃34; ES6中的语法，所以我开始转换我现有的一个类（为了简单起见，我开始使用＆＃34;静态＆＃34;类）。它目前看起来像这样：

define([
    'jquery',
], function($){

    class SomeClass {

        static someStaticFn(){
            //Do whatever
        }
    }

});

我目前遇到的阻碍如何使用RequireJS 引用SomeClass（使用新的ES6语法）。假设甚至可能。

更新

正如其他人在下面指出的那样，返回课程是RequireJS所关心的。我本可以发誓，我已经尝试过了，但果然有效。

如果其他人像我这样的假人并在类似的情况下到此结束，我想也指出我在requirejs-babel插件上取得了一些成功，但只有之后>我重写了我的课程，使用ES6 export 和 import 语句，而不是RequireJS的 define 。完成之后，我在其他任何地方都要包括课程，我必须这样做：

define(['es6!ThisClass'], function(ThisClass){ ...

我最终选择修改每个其他模块中包含的类，因此添加所有这些＆＃34; es6！＆＃34;字符串结果是拖累。尽管将现有项目移植到ES6的this article提到了一种通过RequireJS配置自动化该过程的方法。

但是，由于requirejs-babel在运行时转换了ES6代码，我可能暂时不会将其合并到我的项目中。如果我确定我想用ES6全力以赴，我可能会使用＆＃34;常规＆＃34; Babel或可能TypeScript

Answer 1

ES6 Class只是一个糖衣，下面仍然有相同的实现。您可以使用旧方法按功能创建类。另外请注意浏览器兼容性https://kangax.github.io/compat-table/es6/。

define([
    'jquery',
], function($){

    return class SomeClass {

        static someStaticFn(){
            //Do whatever
        }
    }

});

使用RequireJS包含使用ES6语法定义的类

1 个答案: