ES 6在定义后可以动态地在类上工作 [英] ES 6 dynamically work on class after definition

问题描述

我以前正在滚动自己的Javascript OOP，但现在我正在玩ES6，并希望在定义之后以通用方式使用 defined 类./p>

注意 任何带有new的答案都不是我想要的.

伪代码:

// base.js
class Base {
    constructor(arg) {
        this.arg = arg;
    }

    // This is the behaviour I'm after
    //afterDefined(cls) {
    afterExtended(cls) {    // probably a better name
        console.log(`Class name ${cls.prototype.name}`);
    }
}

// frombase.js
class FromBase extends Base {
    constructor({ p1='val1', p2='val2'} = {}) {
        super(...arguments);
        this.p1 = p1;
        this.p2 = p2;
    }
}

控制台中的输出应为:

'Class name FromBase'

到目前为止，我想出的唯一解决方案是在Base上有一个静态方法，并在定义新类时在类声明之后调用它，但是我很可能会忘记一次以上的操作./p>

请真正彻底地说明为什么我不喜欢静态解决方案；它将迫使我在每个文件中导入Base.

使用静态方法(我不想要)的示例 https://jsfiddle.net/nL4atqvm/:

// base.js
class Base {
    constructor(arg) {
        super(...arguments);
        this.arg = arg;
    }

    // This is the behaviour I'm after
    static afterExtended(cls) {
        console.log(`Class name ${cls.name}`);
    }
}

// frombase.js
class FromBase extends Base {
}
// just after defining the FromBase class
Base.afterExtended(FromBase);

解决方案

当定义了从其扩展的子类时，没有javascript内置触发器在类上调用方法.

因为要滚动自己的库，所以可以设计某种方法来创建并返回扩展给定基类的新类.也许检查一下可能有助于定义类的答案: http://docs.sencha.com/extjs/6.5.1/classic/Ext.ClassManager.html (文档)

http://docs.sencha.com/extjs/6.5.1/classic/src/ClassManager.js.html (源)

当这个问题是关于实例化而不是关于定义类时，我会说:

afterDefined(cls) {
    console.log(`Class name ${this.constructor.name}`);
}

用法:

let x = new FromBase()
x.afterDefined() // --> Class name FromBase

要获取类的名称，请使用

static afterDefined(cls) {
    console.log(`Class name ${this.name}`);
}

I was previously rolling my own Javascript OOP but now I'm playing with ES6 and want to use the class defined after definition in a generic way.

Note Any answer with new in it is not what I'm after.

Pseudo code:

// base.js
class Base {
    constructor(arg) {
        this.arg = arg;
    }

    // This is the behaviour I'm after
    //afterDefined(cls) {
    afterExtended(cls) {    // probably a better name
        console.log(`Class name ${cls.prototype.name}`);
    }
}

// frombase.js
class FromBase extends Base {
    constructor({ p1='val1', p2='val2'} = {}) {
        super(...arguments);
        this.p1 = p1;
        this.p2 = p2;
    }
}

The output in the console should be:

'Class name FromBase'

So far the only solution I have come up with is to have a static method on Base and call it after the class declaration when I define a new class but I will most likely forget to do this more than once.

Just to be really thorough on why I don't like the static solution; it will force me to import Base in every single file.

Example using a static method (which I don't want) https://jsfiddle.net/nL4atqvm/:

// base.js
class Base {
    constructor(arg) {
        super(...arguments);
        this.arg = arg;
    }

    // This is the behaviour I'm after
    static afterExtended(cls) {
        console.log(`Class name ${cls.name}`);
    }
}

// frombase.js
class FromBase extends Base {
}
// just after defining the FromBase class
Base.afterExtended(FromBase);

解决方案

There is no javascript built-in trigger that is calling a method on a class when a subclass is defined that extends from it.

Because you're rolling your own library, you could craft some kind of method the creates and returns a new class that extends a given base class. Maybe check out this answer that may help how to define your classes: Instantiate a JavaScript Object Using a String to Define the Class Name

You could also check how other javascript libraries creates (sub)classes. For example, Ext JS has a ClassManager that you could look into.

• http://docs.sencha.com/extjs/6.5.1/classic/Ext.ClassManager.html (docs)
• http://docs.sencha.com/extjs/6.5.1/classic/src/ClassManager.js.html (source)

When this question would be about instantiation and not about defining classes, I would say:

afterDefined(cls) {
    console.log(`Class name ${this.constructor.name}`);
}

Usage:

let x = new FromBase()
x.afterDefined() // --> Class name FromBase

To get the name of the class, use

static afterDefined(cls) {
    console.log(`Class name ${this.name}`);
}

这篇关于ES 6在定义后可以动态地在类上工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！