小编典典

ES6类变量替代

javascript

当前在ES5中,我们许多人在框架中使用以下模式来创建类和类变量,这很方便:

// ES 5
FrameWork.Class({

    variable: 'string',
    variable2: true,

    init: function(){

    },

    addItem: function(){

    }

});

在ES6中,您可以本机创建类,但是没有选择可以使用类变量:

// ES6
class MyClass {
    const MY_CONST = 'string'; // <-- this is not possible in ES6
    constructor(){
        this.MY_CONST;
    }
}

可悲的是,上述方法不起作用,因为类只能包含方法。

我知道我可以this.myVar = trueconstructor…但我不想“垃圾”我的构造,特别是当我有一个更大的类20-30 +参数。

我在考虑解决该问题的多种方法,但尚未找到任何好的方法。(例如:创建一个ClassConfig处理程序,并传递一个parameter与类分开声明的对象。然后该处理程序将附加到该类。我正在考虑WeakMaps通过某种方式进行集成。)

您将如何处理这种情况?


阅读 320

收藏
2020-04-25

共1个答案

小编典典

更新:

现在有第3阶段的提案-我期待在几个月后使这个答案过时。

同时,使用TypeScript或babel的任何人都可以使用以下语法:

varName = value

在类声明/表达式主体内部,它将定义一个变量。希望在几个月/几周内,我将能够发布更新。

更新:Chrome 74现在附带此语法。


ES
Wiki中针对ES6中提案的注释(最大类别)注释:

没有(有意地)没有直接的声明方式来定义原型数据属性(方法以外的类)或实例属性

类属性和原型数据属性需要在声明之外创建。

在类定义中指定的属性被分配相同的属性,就像它们出现在对象文字中一样。

这意味着 您的要求已被考虑,并明确决定反对。

但为什么?

好问题。TC39的好人希望类声明声明和定义类的功能。不是它的成员。ES6类声明为其用户定义其合同。

请记住,类定义定义了 原型 方法-在原型上定义变量通常不是您要做的事情。您当然可以使用:

constructor(){
    this.foo = bar
}

在像您建议的构造函数中。另请参见共识摘要

ES7及更高版本

ES7 +属性初始化器

等等,给属性赋值似乎是定义类的必要方法!没错,但是,由于它是惯用语言,因此我们以这种方式设计了它。我们完全希望用于属性初始化的更具声明性的语法会在将来的JavaScript版本中出现。它可能看起来像这样:

// Future Version 
export class Counter extends React.Component { 
    static propTypes = { 
        initialCount: React.PropTypes.number
    }; 

    static defaultProps = {
        initialCount: 0
    }; 

    state = {
        count: this.props.initialCount
    }; 

    tick() {
        this.setState({
            count: this.state.count + 1 
        });
    }

    render() {
        return ( <div onClick={this.tick.bind(this)}> Clicks: { this.state.count } </div> ); 
    } 
}
2020-04-25