Wednesday, November 21, 2018

Bekerja dengan Modul Kotlin dan JavaScript




Lihat cara menggunakan Kotlin untuk berinteraksi dengan modul JavaScript.

Dalam tutorial ini kita akan melihat caranya


  
Konfigurasi Modul dengan IntelliJ IDEA

Kotlin menghasilkan kode JavaScript yang kompatibel dengan Asynchronous Module Definition (AMD), CommonJS dan Universal Model Definition (UMD).

  • AMD biasanya digunakan pada sisi-klien di browser. Ide di balik AMD adalah memuat modul secara asinkron, sehingga meningkatkan kegunaan dan kinerja.
  • CommonJS adalah sistem modul yang digunakan di sisi server, dan khususnya dengan node.js. Modul node semua mematuhi definisi ini. Modul CommonJS juga dapat digunakan di browser melalui  Browserify.
  • UMD mencoba menyatukan kedua model yang memungkinkan ini digunakan baik di klien atau server.

Kita dapat mengkonfigurasi opsi compiler Kotlin untuk menggunakan ini. Pilihan terakhir (UMD) akan menghasilkan UMD dan mundur ke opsi lain jika tidak tersedia. Saat ini opsi compiler Kotlin adalah per proyek IntelliJ IDEA sebagai lawan dari modul Kotlin.




Mengkonfigurasi Modul saat menggunakan Maven atau Gradle
Jika menggunakan Maven atau Gradle, kita juga dapat mengkonfigurasi format output modul. Untuk informasi lebih lanjut, lihat JavaScript Modules.


Menggunakan AMD

Saat menggunakan AMD, kami menetapkan opsi kompiler untuk menggunakan AMD. Setelah kami melakukan itu, kami kemudian dapat mereferensikan setiap modul yang kami definisikan sebagai modul yang biasa digunakan AMD.
Misalnya, diberikan

class Customer(val id: Int, val name: String, val email: String) {
var isPreferred = false
fun makePreferred() {
    isPreferred = true
}
}

kode JavaScript berikut akan dibuat

define('customerBL', ['kotlin'], function (Kotlin) { 'use strict'; var = Kotlin.defineRootPackage(null, /** @lends */ {
Customer: Kotlin.createClass(null, function Customer(id, name, email) {
  this.id = id;
  this.name = name;
  this.email = email;
  this.isPreferred = false;
}, /** @lends _.Customer.prototype */ {
  makePreferred: function () {
    this.isPreferred = true;
  }
})
}); Kotlin.defineModule('customerBL', ); return ; });

Dengan asumsi kita memiliki tata letak proyek berikut



Kita bisa mendefinisikan index.html kita untuk memuat require.js bersama dengan main.js sebagai nilai dari data-main atribut.


Sample AMD

Isi dari main.js kita adalah:

requirejs.config({
paths: {
    kotlin: 'out/lib/kotlin.js',
    customerBL: 'out/customerBL'
}
});
requirejs(["customerBL"], function (customerBL) {
console.log(customerBL)
});

Dengan ini, kita dapat mengakses salah satu fungsi yang didefinisikan di dalam customerBL.


Menggunakan CommonJS

Untuk menggunakan Kotlin dengan node.js, kita perlu mengatur opsi kompiler untuk menggunakan CommonJS. Setelah kami melakukan itu, output dari aplikasi harus dapat diakses menggunakan sistem modul node.
Misalnya, diberikan

class Customer(val id: Int, val name: String, val email: String) {
var isPreferred = false
fun makePreferred() {
    isPreferred = true
}
}

kode JavaScript berikut akan dibuat

module.exports = function (Kotlin) { 'use strict'; var = Kotlin.defineRootPackage(null, /** @lends */ {
Customer: Kotlin.createClass(null, function Customer(id, name, email) {
  this.id = id;
  this.name = name;
  this.email = email;
  this.isPreferred = false;
}, /** @lends _.Customer.prototype */ {
  makePreferred: function () {
    this.isPreferred = true;
  }
})
}); Kotlin.defineModule('customerBL', ); return ; }(require('kotlin'));

Baris terakhir adalah memanggil fungsi itu sendiri dan dilewatkan sebagai argumen kotlin, yang mengacu pada pustaka standar. Ini dapat diperoleh dengan salah satu dari dua cara:
 
Local reference

Ketika mengkompilasi, compiler selalu menghasilkan file kotlin.js. Cara termudah untuk mereferensikan ini tanpa harus merujuk ke jalur, adalah dengan mengatur folder pustaka output untuk opsi kompilator ke node_modules. Dengan cara ini, Node akan secara otomatis mengambilnya karena melakukan pencarian file secara menyeluruh di bawah folder-folder ini




NPM Directory

Perpustakaan standar Kotlin tersedia di npm dan kita bisa memasukkannya ke dalam package.json kita sebagai ketergantungan.
Kita hanya dapat merujuk ke fungsi kelas atau anggota apa pun di dalam kode node.js kita hanya dengan mengimpor modul menggunakan require :
var customerBL = require('./scripts/customerBL')
var customer = new customerBL.Customer(1, "Jane Smith", "jane.smith@company.com")
console.dir(customer) customer.makePreferred() console.dir(customer)
Dalam hal ini, kita telah mengatur output dari kompilasi kita ke scripts folder. Saat menjalankan aplikasi, kita harus melihat output berikut:



Reference :

Working with Kotlin and JavaScript Modules

No comments:

Post a Comment

Rekomendasi Aplikasi Penghasil Cuan :D Dirumah saja tetap Dapet Duit !!!

Hallo Bosskyuuh semua. Perkenalkan aku Patrick Ananta berasal dari Jawa Tengah. Aku sudah lama sekali dirumahkan dikarenakan covid19 sehingg...