Javascript 使用BabelJS 6访问类静态属性

下面是演示该问题的最简单的应用程序：

'use strict';

var _ = require('underscore');

class Model
{
    constructor(value) {
        this._value = value;
    }

    get value() {
        return this._value;
    }

    toJS() {
        return this.value;
    }
}

class ObjectModel extends Model
{
    static properties = {};

    constructor(value) {
        super(_.extend({}, new.target.properties, _.pick(value, _.keys(new.target.properties))));
    }
}

class PostModel extends ObjectModel
{
    static properties = {
        title: 'Hello'
        /* content: '<p>Lorem ipsum dolor sit amet</p>' */
    };
}

console.log(new PostModel({title: 'Nice day', aa: 11, bb: 22}).toJS());

我理解为什么要对对象属性执行此操作。但我不明白为什么对类变量也这样做

在BabelJS 5中，我使用了以下技巧：

class ObjectModel extends Model
{
    static properties = {};

    constructor(value) {
        if (0) { super(); }
        super(_.extend({}, this.constructor.properties, _.pick(value, _.keys(this.constructor.properties))));
    }
}

在版本6中，它进行编译，但运行时会产生错误：

Uncaught TypeError: Cannot read property 'constructor' of undefined

在调用

super

之前，是否有办法访问类静态变量？使用类似于

init（）

的东西而不是

构造函数

不是一个选项。也许创建自定义转换插件

系统详细信息：

$ babel --version
6.2.0 (babel-core 6.2.1)

$ cat .babelrc
{
    "presets": ["es2015", "stage-1"]
}

$ babel-doctor

Babel Doctor
Running sanity checks on your system. This may take a few minutes...

✔ Found config at /path/to/.babelrc
✔ No duplicate babel packages found
✔ All babel packages appear to be up to date
✔ You're on npm >=3.3.0

Everything looks all right!

---

解决办法如下：

按照和的建议，坚持新的目标

创建一个transpiler，将所有

新.target

（ES6）转换为

此.constructor

（ES5）：

---

new.target.properties

？让子类重写构造函数并将属性传递给我似乎更清楚，但是是的

new.target

是实现这一点的方法，不幸的是，Babel没有传输它。我只是检查

new.target

。它仅在节点5.0中可用。Chrome和FireFox向我显示错误。此外，BabelJS不会将

new.target

转换为ES5。我使用了

es2015

预设。

$ babel --version
6.2.0 (babel-core 6.2.1)

$ cat .babelrc
{
    "presets": ["es2015", "stage-1"]
}

$ babel-doctor

Babel Doctor
Running sanity checks on your system. This may take a few minutes...

✔ Found config at /path/to/.babelrc
✔ No duplicate babel packages found
✔ All babel packages appear to be up to date
✔ You're on npm >=3.3.0

Everything looks all right!

class ObjectModel extends Model
{
    static properties = {};

    constructor(value) {
        super(_.extend({}, new.target.properties, _.pick(value, _.keys(new.target.properties))));
    }
}

function transpileNewTarget()
{
    return {
        visitor: {
            MetaProperty(path) {
                if (path.isMetaProperty() && path.node.meta.name == 'new' && path.node.property.name == 'target') {
                    path.replaceWithSourceString('this.constructor');
                }
            }
        }
    };
}