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 相关文章推荐
JQuery实现倒计时按钮的实现代码
Mar 23 Javascript
Javascript前端UI框架Kit使用指南之kitjs事件管理
Nov 28 Javascript
javascript实现跨域的方法汇总
Jun 25 Javascript
浅析Bootstrap组件之面板组件
May 04 Javascript
JS本地刷新返回上一页代码
Jul 25 Javascript
手机图片预览插件photoswipe.js使用总结
Aug 25 Javascript
JavaScript、C# URL编码、解码总结
Jan 21 Javascript
MUI顶部选项卡的用法(tab-top-webview-main)详解
Oct 08 Javascript
Vue2.0 axios前后端登陆拦截器(实例讲解)
Oct 27 Javascript
axios post提交formdata的实例
Mar 16 Javascript
详解关于Vue版本不匹配问题(Vue packages version mismatch)
Sep 17 Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
Oct 30 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&&mysql)二
2006/10/09 PHP
在PHP中使用Sockets 从Usenet中获取文件
2008/01/10 PHP
cakephp2.X多表联合查询join及使用分页查询的方法
2017/02/23 PHP
JQuery 选择器 xpath 语法应用
2010/05/13 Javascript
json数据与字符串的相互转化示例
2013/09/18 Javascript
Javascript简单实现可拖动的div
2013/10/22 Javascript
Javascript中克隆一个数组的实现代码
2013/12/06 Javascript
js数组中如何随机取出一个值
2014/06/13 Javascript
页面刷新时记住滚动条的位置jquery代码
2014/06/17 Javascript
jQuery插件bgStretcher.js实现全屏背景特效
2015/06/05 Javascript
JQuery删除DOM节点的方法
2015/06/11 Javascript
jQuery Timelinr实现垂直水平时间轴插件(附源码下载)
2016/02/16 Javascript
全面解析Bootstrap中tab(选项卡)的使用方法
2016/06/06 Javascript
概述VUE2.0不可忽视的很多变化
2016/09/25 Javascript
巧用数组制作图片切换js代码
2016/11/29 Javascript
详解ECMAScript typeof用法
2018/07/25 Javascript
vue 解决循环引用组件报错的问题
2018/09/06 Javascript
Vue项目自动转换 px 为 rem的实现方法
2018/10/29 Javascript
JavaScript/TypeScript 实现并发请求控制的示例代码
2021/01/18 Javascript
linux下python抓屏实现方法
2015/05/22 Python
使用Python的Scrapy框架十分钟爬取美女图
2016/12/26 Python
简单谈谈Python中的json与pickle
2017/07/19 Python
解决python 输出是省略号的问题
2018/04/19 Python
Python实现读取txt文件并转换为excel的方法示例
2018/05/17 Python
Python判断字符串是否为字母或者数字(浮点数)的多种方法
2018/08/03 Python
python和mysql交互操作实例详解【基于pymysql库】
2019/06/04 Python
pandas.DataFrame.drop_duplicates 用法介绍
2020/07/06 Python
python 爬取小说并下载的示例
2020/12/07 Python
Python3爬虫ChromeDriver的安装实例
2021/02/06 Python
解决Pyinstaller打包软件失败的一个坑
2021/03/04 Python
html5中嵌入视频自动播放的问题解决
2020/05/25 HTML / CSS
Linux上比较文件的命令都有哪些
2012/02/24 面试题
婚礼证婚人证婚词
2014/01/08 职场文书
2014庆六一活动方案
2014/03/02 职场文书
施工安全承诺书
2014/05/22 职场文书
Python超简单容易上手的画图工具库推荐
2021/05/10 Python