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中常用的SET和GET
Jan 13 Javascript
JS中令人发指的valueOf方法介绍
Feb 22 Javascript
jquery选择器简述
Aug 31 Javascript
详解JavaScript中|单竖杠运算符的使用方法
May 23 Javascript
javascript运算符语法全面概述
Jul 14 Javascript
实例浅析js的this
Dec 11 Javascript
Node.js与Sails redis组件的使用教程
Feb 14 Javascript
Vue刷新修改页面中数据的方法
Sep 16 Javascript
微信小程序学习笔记之文件上传、下载操作图文详解
Mar 29 Javascript
简单了解微信小程序 e.target与e.currentTarget的不同
Sep 27 Javascript
JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】
May 12 Javascript
vue实现简单的登录弹出框
Oct 26 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
ThinkPHP控制器间实现相互调用的方法
2014/10/31 PHP
如何解决PHP无法实现多线程的问题
2015/09/25 PHP
js获取变量
2006/08/24 Javascript
理解JavaScript的caller,callee,call,apply
2009/04/28 Javascript
屏蔽F1~F12的快捷键的js函数
2010/05/06 Javascript
javascript学习之闭包分析
2010/12/02 Javascript
用Javascript评估用户输入密码的强度实现代码
2011/11/30 Javascript
innerHTML与jquery里的html()区别介绍
2012/10/12 Javascript
js网页中的(运行代码)功能实现思路
2013/02/04 Javascript
JS小功能(setInterval实现图片效果显示时间)实例代码
2013/11/28 Javascript
jQuery对Select的操作大集合(收藏)
2013/12/28 Javascript
javascript自定义in_array()函数实现方法
2015/08/03 Javascript
node.js cookie-parser之parser.js
2016/06/06 Javascript
移动端日期插件Mobiscroll.js使用详解
2016/12/19 Javascript
Javascript继承机制详解
2017/05/30 Javascript
解决vue中修改export default中脚本报一大堆错的问题
2018/08/27 Javascript
浅谈vue项目打包优化策略
2018/09/29 Javascript
详解原生JS回到顶部
2019/03/25 Javascript
微信小程序实现下拉框功能
2019/07/16 Javascript
封装微信小程序http拦截器过程解析
2019/08/13 Javascript
使用IPython来操作Docker容器的入门指引
2015/04/08 Python
在Mac OS上部署Nginx和FastCGI以及Flask框架的教程
2015/05/02 Python
Python win32com 操作Exce的l简单方法(必看)
2017/05/25 Python
python实现批量按比例缩放图片效果
2018/03/30 Python
Python文件路径名的操作方法
2019/10/30 Python
python3发送request请求及查看返回结果实例
2020/04/30 Python
Django自关联实现多级联动查询实例
2020/05/19 Python
python3.7+selenium模拟淘宝登录功能的实现
2020/05/26 Python
CSS3 @font-face属性使用指南
2014/12/12 HTML / CSS
瑞典领先的汽车零部件网上零售商:bildelaronline24.se
2017/01/12 全球购物
医学护理系毕业生求职信
2013/10/01 职场文书
食品安全检查制度
2014/02/03 职场文书
研究生导师评语
2014/12/31 职场文书
升职感谢领导的话语及升职感谢信
2019/06/24 职场文书
OpenCV中resize函数插值算法的实现过程(五种)
2021/06/05 Python
mysql创建存储过程及函数详解
2021/12/04 MySQL