JavaScript 中调用 Kotlin 方法实例详解


Posted in Javascript onJune 09, 2017

JavaScript 中调用 Kotlin 方法实例详解

Kotlin 编译器生成正常的 JavaScript 类,可以在 JavaScript 代码中自由地使用的函数和属性 。不过,你应该记住一些微妙的事情。

用独立的 JavaScript 隔离声明

为了防止损坏全局对象,Kotlin 创建一个包含当前模块中所有 Kotlin 声明的对象 。所以如果你把模块命名为 myModule,那么所有的声明都可以通过 myModule 对象在 JavaScript 中可用。例如:

fun foo() = "Hello"

可以在 JavaScript 中这样调用:

alert(myModule.foo());

这不适用于当你将 Kotlin 模块编译为 JavaScript 模块时(关于这点的详细信息请参见 JavaScript 模块)。 在这种情况下,不会有一个包装对象,而是将声明作为相应类型的 JavaScript 模块对外暴露。例如, 对于 CommonJS 的场景,你应该写:

alert(require('myModule').foo());

包结构

Kotlin 将其包结构暴露给 JavaScript,因此除非你在根包中定义声明, 否则必须在 JavaScript 中使用完整限定的名称。例如:

package my.qualified.packagename

fun foo() = "Hello"

可以在 JavaScript 中这样调用:

alert(myModule.my.qualified.packagename.foo());

@JsName 注解

在某些情况下(例如为了支持重载),Kotlin 编译器会修饰(mangle) JavaScript 代码中生成的函数和属性的名称。要控制生成的名称,可以使用 @JsName 注解:

// 模块“kjs”
class Person(val name: String) {
  fun hello() {
    println("Hello $name!")
  }

  @JsName("helloWithGreeting")
  fun hello(greeting: String) {
    println("$greeting $name!")
  }
}

 现在,你可以通过以下方式在 JavaScript 中使用这个类:

var person = new kjs.Person("Dmitry");  // 引用到模块“kjs”
person.hello();             // 输出“Hello Dmitry!”
person.helloWithGreeting("Servus");   // 输出“Servus Dmitry!”

如果我们没有指定 @JsName 注解,相应函数的名称会包含从函数签名计算而来的后缀,例如 hello_61zpoe$。

请注意,Kotlin 编译器不会对 external 声明应用这种修饰,因此你不必在其上使用 @JsName。 值得注意的另一个例子是从外部类继承的非外部类。 在这种情况下,任何被覆盖的函数也不会被修饰。

@JsName 的参数需要是一个常量字符串字面值,该字面值是一个有效的标识符。 任何尝试将非标识符字符串传递给 @JsName 时,编译器都会报错。 以下示例会产生编译期错误:

@JsName("new C()")  // 此处出错
external fun newC()

在 JavaScript 中表示 Kotlin 类型

  1. 除了 kotlin.Long 的 Kotlin 数字类型映射到 JavaScript Number。
  2. kotlin.Char 映射到 JavaScript Number 来表示字符代码。
  3. Kotlin 在运行时无法区分数字类型(kotlin.Long 除外),即以下代码能够工作:
fun f() {
  val x: Int = 23
  val y: Any = x
  println(y as Float)
}
  1. Kotlin 保留了 kotlin.Int、 kotlin.Byte、 kotlin.Short、 kotlin.Char 和 kotlin.Long 的溢出语义。
  2. JavaScript 中没有 64 位整数,所以 kotlin.Long 没有映射到任何 JavaScript 对象, 它是由一个 Kotlin 类模拟的。
  3. kotlin.String 映射到 JavaScript String。
  4. kotlin.Any 映射到 JavaScript Object(即 new Object()、 {} 等)。
  5. kotlin.Array 映射到 JavaScript Array。
  6. Kotlin 集合(即 List、 Set、 Map 等)没有映射到任何特定的 JavaScript 类型。
  7. kotlin.Throwable 映射到 JavaScript Error。
  8. Kotlin 在 JavaScript 中保留了惰性对象初始化。
  9. Kotlin 不会在 JavaScript 中实现顶层属性的惰性初始化。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
javascript判断用户浏览器插件安装情况的代码
Jan 01 Javascript
JavaScript 判断日期格式是否正确的实现代码
Jul 04 Javascript
js中typeof的用法汇总
Dec 12 Javascript
Javascript单元测试框架QUnitjs详细介绍
May 08 Javascript
jQuery检测滚动条是否到达底部
Dec 15 Javascript
js下将金额数字每三位一逗号分隔
Feb 19 Javascript
bootstrap布局中input输入框右侧图标点击功能
May 16 Javascript
ionic开发中点击input时键盘自动弹出
Dec 23 Javascript
巧用canvas
Jan 21 Javascript
原生JavaScript实现AJAX、JSONP
Feb 07 Javascript
Express之托管静态文件的方法
Jun 01 Javascript
layui--select使用以及下拉框实现键盘选择的例子
Sep 24 Javascript
angularjs $http实现form表单提交示例
Jun 09 #Javascript
JavaScript设计模式之单例模式详解
Jun 09 #Javascript
Bootstrap Table使用整理(四)之工具栏
Jun 09 #Javascript
JavaScript设计模式之策略模式详解
Jun 09 #Javascript
Bootstrap Table使用整理(三)
Jun 09 #Javascript
Bootstrap Table使用整理(二)
Jun 09 #Javascript
Bootstrap Table使用整理(一)
Jun 09 #Javascript
You might like
php实现可运算的验证码
2015/11/10 PHP
PHP实现限制IP访问及提交次数的方法详解
2017/07/17 PHP
yii2.0整合阿里云oss删除单个文件的方法
2017/09/19 PHP
分享20款好玩的jQuery游戏
2011/04/17 Javascript
自定义百度分享的分享按钮
2015/03/18 Javascript
javascript实现在线客服效果
2015/07/15 Javascript
jQuery实现的调整表格行tr上下顺序
2016/01/10 Javascript
AngularJS自定义指令实现面包屑功能完整实例
2017/05/17 Javascript
详解webpack打包vue时提取css
2017/05/26 Javascript
angular使用post、get向后台传参的问题实例
2017/05/27 Javascript
Vue组件化通讯的实例代码
2017/06/23 Javascript
微信小程序 本地图片按照屏幕尺寸处理
2017/08/04 Javascript
动态加载、移除js/css文件的示例代码
2018/03/20 Javascript
JS基于Location实现访问Url、重定向及刷新页面的方法分析
2018/12/03 Javascript
详解 微信小程序开发框架(MINA)
2019/05/17 Javascript
JavaScript Tab菜单实现过程解析
2020/05/13 Javascript
浅谈JavaScript中的“!!”作用
2020/08/03 Javascript
基于JavaScript实现轮播图效果
2021/01/02 Javascript
[05:03]2018DOTA2亚洲邀请赛主赛事首日回顾
2018/04/04 DOTA
python实现保存网页到本地示例
2014/03/16 Python
Python设计模式之模板方法模式实例详解
2019/01/17 Python
Python docx库用法示例分析
2019/02/16 Python
Python Threading 线程/互斥锁/死锁/GIL锁
2019/07/21 Python
Python类反射机制使用实例解析
2019/12/30 Python
Python代码一键转Jar包及Java调用Python新姿势
2020/03/10 Python
使用python实现名片管理系统
2020/06/18 Python
Expedia意大利旅游网站:酒店、机票和租车预订
2017/10/30 全球购物
Groupon比利时官方网站:特卖和网上购物高达-70%
2019/08/09 全球购物
学校领导班子对照检查材料
2014/08/28 职场文书
2014年个人思想工作总结
2014/11/27 职场文书
公司员工手册范本
2015/05/14 职场文书
2016年度员工工作表现评语
2015/12/02 职场文书
JavaScript使用canvas绘制坐标和线
2021/04/28 Javascript
详解CSS玩转图片Base64编码
2021/05/25 HTML / CSS
Pytest中conftest.py的用法
2021/06/27 Python
四十九个javascript小知识实用技巧
2021/11/20 Javascript