如何正确扩展Kotlin/JS的JS包装类 解决Path2D子类构造报错问题

Kotlin/JS对直接继承Path2D这类浏览器原生external JS类的支持存在限制，自动生成的JS代码调用父类构造函数的逻辑不符合原生API要求，因此抛出「Path2D constructor: 'new' is required」错误。

方案1：组合实现（最稳定，无兼容问题） #

无需强行继承Path2D，在自定义类内部持有原生Path2D实例，代理需要用到的原生方法后再添加自定义逻辑即可：

class ExtraPath {
    // 内部持有原生Path2D实例
    private val nativePath = Path2D()

    // 代理需要用到的Path2D原生方法
    fun rect(x: Double, y: Double, width: Double, height: Double) = nativePath.rect(x, y, width, height)
    // 其他需要的Path2D方法都可按相同规则代理

    // 自定义扩展方法
    fun extraFunction() {
        // 自定义逻辑
    }

    // 需要传入原生API时调用该方法获取原生实例
    fun getNativePath() = nativePath
}

调用示例：

fun main() {
    val canvas=document.getElementById("mainCanvas") as HTMLCanvasElement
    val ctx=canvas.getContext("2d") as CanvasRenderingContext2D
    val path=ExtraPath()
    path.rect(10.0,10.0,10.0,10.0)
    ctx.stroke(path.getNativePath())
    path.extraFunction()
}

方案2：实现Path2D接口（适配原生API入参要求） #

如果你的自定义类必须直接作为Path2D类型传入原生API，可以用Kotlin类委托特性实现Path2D接口，所有原生方法自动代理给内部的原生实例：

class ExtraPath private constructor(private val native: Path2D) : Path2D by native {
    constructor() : this(js("new Path2D()") as Path2D)

    fun extraFunction() {
        // 自定义逻辑
    }
}

调用时可直接作为Path2D实例使用：

fun main() {
    val canvas=document.getElementById("mainCanvas") as HTMLCanvasElement
    val ctx=canvas.getContext("2d") as CanvasRenderingContext2D
    val path=ExtraPath()
    path.rect(10.0,10.0,10.0,10.0)
    ctx.stroke(path) // 直接传入即可正常运行
    path.extraFunction()
}

内容的提问来源于stack exchange，提问作者D. Kupra