如何在 Kotlin 中为 Javascript 的类设置静态属性答案

【问题标题】：How to set a static property on a class in Kotlin for Javascript如何在 Kotlin 中为 Javascript 的类设置静态属性
【发布时间】：2017-12-10 20:57:17
【问题描述】：

我有一种情况，我需要在 Kotlin 中的类上定义一个静态属性，并且当它编译为 Javascript 时，它会成为该类上真正的静态字段。在这种情况下，伴随对象不起作用。

例如，如果我有一个抽象类及其实现类，如下所示：

abstract class MyAbstractClass{
  abstract val id: Int
}

class MyClass: MyAbstractClass(){
  override val id: Int = 1 //I want this to actually be "static" on the MyClass
}

这个编译成的Javascript是这样的：

function MyAbstractClass() {
}

function MyClass() {
  MyAbstractClass.call(this);
  this.id_jz5fma$_0 = 1;
}

Object.defineProperty(MyClass.prototype, 'id', {
  get: function () {
    return this.id_jz5fma$_0;
  }
});

但我需要它编译成这样：

function MyAbstractClass() {
}

function MyClass() {
  MyAbstractClass.call(this);
}

MyClass.id = 1;

这样id 字段确实静态存在于MyClass 上，而无需创建MyClass 的新实例。

我尝试使用伴生对象，但它创建了一个名为 MyClass$Companion 的单独对象/函数，然后将 id 字段分配给该对象，但实际上从未将其静态分配给 MyClass。

如何在 Kotlin 中设置像这样的真正静态字段？

【问题讨论】：

如果你编译到 JVM 有一个 @JvmStatic 注解。也许 JS 也有类似的东西？
相关问题：youtrack.jetbrains.com/issue/KT-18891
您可以在类上声明静态变量，但不能声明抽象静态变量。没有这样的事情。

标签： javascript kotlin kotlin-js-interop

【解决方案1】：

目前我们没有直接的方法，所以我创建了问题https://youtrack.jetbrains.com/issue/KT-18891

作为一种解决方法，您可以编写这样的函数：

inline fun <reified T : Any> addStaticMembersTo(source: Any) {
    val c = T::class.js.asDynamic()
    val ownNames = js("Object").getOwnPropertyNames(source) as Array<String>
    val protoNames = js("Object").getOwnPropertyNames(source.asDynamic().constructor.prototype) as Array<String>

    for (name in ownNames + protoNames) {
        c[name] = source.asDynamic()[name]
    }
}

并像这样使用：

class A {
    companion object {
        init {
            addStaticMembersTo<A>(object {
                val bar = 1
                fun foo() {}                
            })
        }
    }
}

甚至可以将伴生对象的成员作为类的静态成员使用：

class B {
    companion object {
        val bar = 1
        fun foo() {}                

        // should be at the end of companion object
        init {
            addStaticMembersTo<B>(this)
        }
    }
}

此处提供的完整示例： https://try.kotl.in/#/UserProjects/uube1qikg3vsegtnefo0ad0jag/30f1qf87dt5k5vjhciirt4t108

【讨论】：