Skip to content

Commit 8c151f1

Browse files
chore(examples): add Kotlin/JS examples
1 parent 18061bc commit 8c151f1

File tree

5 files changed

+455
-0
lines changed

5 files changed

+455
-0
lines changed

examples/09_kjs/00_description.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Kotlin/JS
2+

examples/09_kjs/01_dynamic.md

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
# dynamic
2+
3+
*dynamic* is a special type in Kotlin/JS. It basically turns off Kotlin's type checker.
4+
That is needed in order to interoperate with untyped or loosely typed environments, such
5+
as the JavaScript ecosystem.
6+
7+
<div class="language-kotlin" theme="idea" data-min-compiler-version="1.3" data-target-platform="js">
8+
9+
```kotlin
10+
fun main(){
11+
//sampleStart
12+
val a: dynamic = "abc" // 1
13+
val b: String = a // 2
14+
15+
fun firstChar(s: String) = s[0]
16+
17+
println("${firstChar(a)} == ${firstChar(b)}") // 3
18+
19+
println("${a.charCodeAt(0, "dummy argument")} == ${b[0].toInt()}") // 4
20+
21+
println(a.charAt(1).repeat(3)) // 5
22+
23+
fun plus(v: dynamic) = v + 2
24+
25+
println("2 + 2 = ${plus(2)}") // 6
26+
println("'2' + 2 = ${plus("2")}")
27+
//sampleEnd
28+
}
29+
```
30+
31+
</div>
32+
33+
1. Any value can be assigned to variable to `dynamic` type
34+
2. Dynamic value can be assigned to anything.
35+
3. Dynamic value can be passed as argument to any function
36+
4. Any property or function with any arguments can be called on `dynamic` value
37+
5. Dynamic call always returns dynamic value, so it is possible to chain them.
38+
6. Operators, assignments and indexed access (`[..]`) are translated "as is". Beware!

examples/09_kjs/02_js_function.md

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# JS function
2+
3+
You can inline some JavaScript code into your Kotlin code using the `js("…")` function.
4+
Should be used with extreme care.
5+
6+
<div class="language-kotlin" theme="idea" data-min-compiler-version="1.3" data-target-platform="js">
7+
8+
```kotlin
9+
fun main(){
10+
//sampleStart
11+
val json = js("{}") // 1
12+
json.name = "Jane" // 2
13+
json.hobby = "movies"
14+
15+
println(JSON.stringify(json)) // 3
16+
//sampleEnd
17+
}
18+
```
19+
20+
</div>
21+
22+
1. Create a JavaScript object literal. The `js(...)` function return type is `dynamic`.
23+
2. Add some properties by utilizing the `dynamic` type capabilities.
24+
3. Pass the JSON to JavaScript API.

examples/09_kjs/03_external.md

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# External declarations
2+
3+
*external* keyword allows to declare existing JavaScript API in a type-safe way.
4+
5+
<div class="language-kotlin" theme="idea" data-min-compiler-version="1.3" data-target-platform="js">
6+
7+
```kotlin
8+
external fun alert(msg: String) // 1
9+
10+
fun main() {
11+
alert("Hi!") // 2
12+
}
13+
```
14+
15+
</div>
16+
17+
1. Declare an existing JavaScript function `alert` which takes a single `String` argument
18+
2. Use it as if it was regular Kotlin.
19+
20+
Note that Kotlin checks during compilation that exactly a single argument of type `String` is passed.
21+
That prevents a number of bugs even when using pure JavaScript API - same as with regular Kotlin.
22+
23+
Please [refer to the docs](https://kotlinlang.org/docs/reference/js-interop.html#external-modifier) in order
24+
to learn more about describing existing JavaScript API.

0 commit comments

Comments
 (0)