Kotlin調用JavaScript

Kotlin 已被設計爲能夠與 Java 平臺輕鬆互操作。它將 Java 類視爲 Kotlin 類,並且
Java 也將 Kotlin 類視爲 Java 類。但是,JavaScript 是一種動態類型語言,這意味着
它不會在編譯期檢查類型。你可以通過動態類型在
Kotlin 中自由地與 JavaScript 交流,但是如果你想要 Kotlin 類型系統的全部威力
,你可以爲 JavaScript 庫創建 Kotlin 頭文件。

內聯 JavaScript

你可以使用 js(「……」) 函數將一些 JavaScript 代碼嵌入到 Kotlin 代碼中。
例如:

fun jsTypeOf(o: Any): String {
    return js("typeof o")
}

js 的參數必須是字符串常量。因此,以下代碼是不正確的:

fun jsTypeOf(o: Any): String {
    return js(getTypeof() + " o") // 此處報錯
}
fun getTypeof() = "typeof"

external 修飾符

要告訴 Kotlin 某個聲明是用純 JavaScript 編寫的,你應該用 external 修飾符來標記它。
當編譯器看到這樣的聲明時,它假定相應類、函數或
屬性的實現由開發人員提供,因此不會嘗試從聲明中生成任何 JavaScript 代碼。
這意味着你應該省略 external 聲明內容的代碼體。例如:

external fun alert(message: Any?): Unit

external class Node {
    val firstChild: Node

    fun append(child: Node): Node

    fun removeChild(child: Node): Node

    // 等等
}

external val window: Window

請注意,嵌套的聲明會繼承 external 修飾符,即在 Node 類中,我們在
成員函數和屬性之前並不放置 external

external 修飾符只允許在包級聲明中使用。 你不能聲明一個非 external 類的 external 成員。

聲明類的(靜態)成員

在 JavaScript 中,你可以在原型或者類本身上定義成員。即:

function MyClass() {
}
MyClass.sharedMember = function() { /* 實現 */ };
MyClass.prototype.ownMember = function() { /* 實現 */ };

Kotlin 中沒有這樣的語法。然而,在 Kotlin 中我們有伴生(companion)對象。Kotlin 以特殊的方式處理
external 類的伴生對象:替代期待一個對象的是,它假定伴生對象的成員
就是該類自身的成員。要描述來自上例中的 MyClass,你可以這樣寫:

external class MyClass {
    companion object {
        fun sharedMember()
    }

    fun ownMember()
}

聲明可選參數

一個外部函數可以有可選參數。
JavaScript 實現實際上如何計算這些參數的默認值,是 Kotlin 所不知道的,
因此在 Kotlin 中不可能使用通常的語法聲明這些參數。
你應該使用以下語法:

external fun myFunWithOptionalArgs(x: Int,
    y: String = definedExternally,
    z: Long = definedExternally)

這意味着你可以使用一個必需參數和兩個可選參數來調用 myFunWithOptionalArgs(它們的
默認值由一些 JavaScript 代碼算出)。

擴展 JavaScript 類

你可以輕鬆擴展 JavaScript 類,因爲它們是 Kotlin 類。只需定義一個 external 類並用
external 類擴展它。例如:

external open class HTMLElement : Element() {
    /* 成員 */
}

class CustomElement : HTMLElement() {
    fun foo() {
        alert("bar")
    }
}

有一些限制:

  1. 當一個外部基類的函數被簽名重載時,不能在派生類中覆蓋它。
  2. 不能覆蓋一個使用默認參數的函數。

請注意,你無法用外部類擴展非外部類。

external 接口

JavaScript 沒有接口的概念。當函數期望其參數支持 foo
bar 方法時,只需傳遞實際具有這些方法的對象。
對於靜態類型的 Kotlin,你可以使用接口來表達這點,例如:

external interface HasFooAndBar {
    fun foo()

    fun bar()
}

external fun myFunction(p: HasFooAndBar)

外部接口的另一個使用場景是描述設置對象。例如:

external interface JQueryAjaxSettings {
    var async: Boolean

    var cache: Boolean

    var complete: (JQueryXHR, String) -> Unit

    // 等等
}

fun JQueryAjaxSettings(): JQueryAjaxSettings = js("{}")

external class JQuery {
    companion object {
        fun get(settings: JQueryAjaxSettings): JQueryXHR
    }
}

fun sendQuery() {
    JQuery.get(JQueryAjaxSettings().apply {
        complete = { (xhr, data) ->
            window.alert("Request complete")
        }
    })
}

外部接口有一些限制:

  1. 它們不能在 is 檢查的右側使用。
  2. as 轉換爲外部接口總是成功(並在編譯時產生警告)。
  3. 它們不能作爲具體化類型參數傳遞。
  4. 它們不能用在類的字面值表達式(即 I::class)中。