您现在的位置是：主页 > news > 动态网站开发结束语/在线域名ip查询
动态网站开发结束语/在线域名ip查询
admin2025/6/6 16:37:05【news】
简介动态网站开发结束语,在线域名ip查询,网站建设进度汇报,网站建设公司在哪里宣传kotlin开发我认为读者已经熟悉Kotlin语言。 从该网站刊登广告： JVM，Android和浏览器的静态类型的编程语言与Java™100％可互操作 — Kotlin网站上的标题 Kotlin首次渗透到Android生态系统，并在那里得到了广泛的采用。 通过Spring B…
kotlin开发
我认为读者已经熟悉Kotlin语言。 从该网站刊登广告：
JVM，Android和浏览器的静态类型的编程语言与Java™100％可互操作
Kotlin首次渗透到Android生态系统，并在那里得到了广泛的采用。 通过Spring Boot，JVM上也有增长的趋势。 从最新的1.1版本开始，Kotlin还提供了生产级的Kotlin至JavaScript转译器。 这篇文章专门针对后者。
恕我直言，与将Kotlin转换为JavaScript的过程有关的最大问题是， 文档仅针对服务器端的构建工具，就像Maven和Gradle一样，或更糟的是IntelliJ IDEA IDE。 这些对于后端驱动的项目或原型非常有效，但是对那些以npm，Grunt / Gulp，yarn等为基础的前端开发人员却无济于事。
让我们使用Kotlin创建一个简单的Google Maps来解决此问题。
管理构建文件
本节假定：已经通过npm install -g grunt-cli安装了Grunt命令行。kotlin软件包已安装，并且kotlin编译器在路径中。 我个人使用Homebrew-brew install kotlin
构建文件如下所示：
module.exports=function(grunt){grunt.initConfig({clean:'dist/**',exec:{cmd:'kotlinc-js src -output dist/script.js' (1)},copy:{ (2)files:{expand:true,flatten:true,src:['src/**/*.html','src/**/*.css'],dest:'dist'}}});grunt.loadNpmTasks('grunt-contrib-clean');grunt.loadNpmTasks('grunt-contrib-copy');grunt.loadNpmTasks('grunt-exec');grunt.registerTask('default',['exec','copy']);
};- 将
src文件夹中找到的所有Kotlin文件转换为单个JavaScript文件 - 将CSS和HTML文件复制到
dist文件夹
在Kotlin中桥接Google Maps API
以下代码段使用Google Maps API创建一个Map对象，该对象将显示在特定的div元素上：
varelement=document.getElementById('map');
newgoogle.maps.Map(element,{center:{lat:46.2050836,lng:6.1090691},zoom:8
});像在TypeScript中一样，必须有一个瘦的Kotlin适配器才能桥接原始JavaScript API。 与TypeScript不同，不存在此类适配器的现有存储库 。 以下是幼稚的初稿：
externalclassMap(element:Element?,options:Json?)external关键字用于告诉编译器功能主体是在另一个文件或库中实现的。
第一个问题来自名称冲突： Map是现有的Kotlin类，默认情况下已导入。 幸运的是， @JsName批注允许在转换时转换名称。
@JsName("Map")
externalclassGoogleMap(element:Element?,options:Json?) 发生第二个问题是因为原始API在名称空间中：该对象不是Map ，而是google.maps.Map 。 先前的注释不允许点，但其他注释的组合可以解决问题：
@JsModule("google")
@JsQualifier("maps")
@JsName("Map")
externalclassGoogleMap(element:Element?,options:Json?) 这仍然行不通-甚至无法编译，因为@JsQualifier无法应用于类。 最终的工作代码是：
@file:JsModule("google")
@file:JsQualifier("maps")
@file:JsNonModulepackagegoogle.maps@JsName("Map")
externalclassGoogleMap(element:Element?,options:Json?)呼叫Google地图
调用上面的代码非常简单，但是请注意，构造函数的第二个参数是Json类型。 当然，这与使用Kotlin的强类型代码有很大不同。 为了解决这个问题，让我们创建实类型：
internalclassMapOptions(valcenter:LatitudeLongitude,valzoom:Byte)
internalclassLatitudeLongitude(vallatitude:Double,vallongitude:Double) 借助Kotlin的扩展功能-和开箱即用的json()函数，让他们能够将自己序列化为JSON：
internalfunLatitudeLongitude.toJson()=json("lat"tolatitude,"lng"tolongitude)
internalfunMapOptions.toJson()=json("center"tocenter.toJson(),"zoom"tozoom)这样就可以编写以下内容：
funinitMap(){valdiv=document.getElementById("map")vallatLng=LatitudeLongitude(latitude=-34.397,longitude=150.644)valoptions=MapOptions(center=latLng,zoom=8)GoogleMap(element=div,options=options.toJson())
}细化
我们可以在这一点上停下来，感觉已经有所成就。 但是Kotlin允许更多。
徒劳的结果是将JSON序列化移动到Map构造函数：
internalclassKotlinGoogleMap(element:Element?,options:MapOptions):GoogleMap(element,options.toJson())KotlinGoogleMap(element=div,options=options)进一步完善
“域”非常适合使用DSL编写。 让我们更新“ API”：
externalopenclassGoogleMap(element:Element?){funsetOptions(options:Json)
}internalclassMapOptions{lateinitvarcenter:LatitudeLongitudevarzoom:Byte=1funcenter(init:LatitudeLongitude.()->Unit){center=LatitudeLongitude().apply(init)}funtoJson()=json("center"tocenter.toJson(),"zoom"tozoom)
}internalclassLatitudeLongitude(){varlatitude:Double=0.0varlongitude:Double=0.0funtoJson()=json("lat"tolatitude,"lng"tolongitude)
}internalclassKotlinGoogleMap(element:Element?):GoogleMap(element){funoptions(init:MapOptions.()->Unit){valoptions=MapOptions().apply(init)setOptions(options=options.toJson())}
}internalfunkotlinGoogleMap(element:Element?,init:KotlinGoogleMap.()->Unit)=KotlinGoogleMap(element).apply(init)客户端代码现在可以写成：
funinitMap(){valdiv=document.getElementById("map")kotlinGoogleMap(div){options{zoom=6center{latitude=46.2050836longitude=6.1090691}}}
}结论
尽管文档非常简洁，但可以仅使用JavaScript生态系统将Kotlin代码转换为JavaScript。 诚然，桥接现有图书馆是一件繁琐的事，但这只是一次努力，因为社区开始分享他们的努力。 另一方面，使Kotlin成为在服务器端使用的一种很棒的语言的相同功能（ 例如编写DSL）也可以在前端受益。
翻译自: https://blog.frankel.ch/kotlin-front-end-developers/
kotlin开发
