第2章快速開始：HelloWorld 《Kotlin 極簡教程》

時間 2020-01-23

標籤快速開始 helloworld Kotlin 極簡教程简体版

原文原文鏈接

第2章快速開始：HelloWorld

《Kotlin極簡教程》正式上架：

點擊這裏 > 去京東商城購買閱讀

點擊這裏 > 去天貓商城購買閱讀

很是感謝您親愛的讀者，你們請多支持！！！有任何問題，歡迎隨時與我交流~

「Hello, World"程序是指在計算機屏幕上輸出「Hello,world」這行字符串的計算機程序，「hello, world」的中文意思是「世界，你好」。這個程序在Brian Kernighan 和Dennis M. Ritchie合著的《The C Programme Language》使用而普遍流行。由於它的簡潔、實用，表達了一個編程語言的極簡功能。javascript

咱們在本章將介紹使用Kotlin程序設計語言**，分別使用命令行、應用程序、Web RESTFul、Android、Kotlin JavaScript等方式向世界問好：你好，世界。html

2.1 命令行版HelloWorld

安裝配置完Kotlin命令行環境以後，咱們直接命令行輸入kotlinc, 便可進入 Kotlin REPL界面。前端

$ kotlinc
Welcome to Kotlin version 1.1.2-2 (JRE 1.8.0_40-b27)
Type :help for help, :quit for quit
>>> println("Hello,World!")
Hello,World!

>>> import java.util.Date
>>> Date()
Wed Jun 07 14:19:33 CST 2017

2.2 應用程序版HelloWorld

咱們若是想擁有學習Kotlin的相對較好的體驗，就不建議使用eclipse了。畢竟Kotlin是JetBrains家族的親兒子，跟Intelli IDEA是血濃於水啊。java

咱們使用IDEA新建gradle項目，選擇Java，Kotlin(Java)框架支持，以下圖：node

新建完項目，咱們寫一個HelloWorld.kt類mysql

package com.easy.kotlin

/**
 * Created by jack on 2017/5/29.
 */

import java.util.Date
import java.text.SimpleDateFormat

fun main(args: Array<String>) {
    println("Hello, world!")
    println(SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(Date()))
}

總體的項目目錄結構以下jquery

.
├── README.md
├── build
│   ├── classes
│   │   └── main
│   │       ├── META-INF
│   │       │   └── easykotlin_main.kotlin_module
│   │       └── com
│   │           └── easy
│   │               └── kotlin
│   │                   └── HelloWorldKt.class
│   └── kotlin-build
│       └── caches
│           └── version.txt
├── build.gradle
├── settings.gradle
└── src
    ├── main
    │   ├── java
    │   ├── kotlin
    │   │   └── com
    │   │       └── easy
    │   │           └── kotlin
    │   │               └── HelloWorld.kt
    │   └── resources
    └── test
        ├── java
        ├── kotlin
        └── resources

21 directories, 7 files

直接運行HelloWorld.kt，輸出結果以下android

Hello, world!
2017-05-29 01:15:30

關於工程的編譯、構建、運行，是由gradle協同kotlin-gradle-plugin，在kotlin-stdlib-jre8，kotlin-stdlib核心依賴下完成的。build.gradle配置文件以下：git

group 'com.easy.kotlin'
version '1.0-SNAPSHOT'

buildscript {
    ext.kotlin_version = '1.1.1'

    repositories {
        mavenCentral()
    }
    dependencies {
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }
}

apply plugin: 'java'
apply plugin: 'kotlin'

sourceCompatibility = 1.8

repositories {
    mavenCentral()
}

dependencies {
    compile "org.jetbrains.kotlin:kotlin-stdlib-jre8:$kotlin_version"
    testCompile group: 'junit', name: 'junit', version: '4.12'
}

工程源碼地址：https://github.com/EasyKotlin...程序員

2.3 Web RESTFul HelloWorld

本節介紹使用 Kotlin 結合 SpringBoot 開發一個RESTFul版本的 Hello.World。

新建gradle，kotlin工程：

打開IDEA的File > New > Project , 以下圖

按照界面操做，輸入相應的工程名等信息，便可新建一個使用Gradle構建的標準Kotlin工程。

build.gradle 基本配置

IDEA自動生成的Gradle配置文件以下：

group 'com.easy.kotlin'
version '1.0-SNAPSHOT'

buildscript {
    ext.kotlin_version = '1.1.2-2'
    
    repositories {
        mavenCentral()
    }
    dependencies {
//        Kotlin Gradle插件
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"

    }
}

apply plugin: 'java'
apply plugin: 'kotlin'

sourceCompatibility = 1.8
targetCompatibility = 1.8

repositories {
    mavenCentral()
}

dependencies {
    compile "org.jetbrains.kotlin:kotlin-stdlib-jre8:$kotlin_version"
    testCompile group: 'junit', name: 'junit', version: '4.12'

}

從上面的配置文件咱們能夠看出，IDEA已經自動把Gradle 構建Kotlin工程插件 kotlin-gradle-plugin，以及Kotlin標準庫kotlin-stdlib添加到配置文件中了。

配置SpringBoot相關內容

下面咱們來配置SpringBoot相關內容。首先在構建腳本里面添加ext變量springBootVersion。

ext.kotlin_version = '1.1.2-2'
ext.springboot_version = '1.5.2.RELEASE'

而後在構建依賴裏添加spring-boot-gradle-plugin

buildscript {
...
    dependencies {
//        Kotlin Gradle插件
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
//        SpringBoot Gradle插件
        classpath("org.springframework.boot:spring-boot-gradle-plugin:$springboot_version")

//        Kotlin整合SpringBoot的默認無參構造函數，默認把全部的類設置open類插件
        classpath("org.jetbrains.kotlin:kotlin-noarg:$kotlin_version")
        classpath("org.jetbrains.kotlin:kotlin-allopen:$kotlin_version")
    }
}

配置無參（no-arg）、全開放（allopen）插件

其中,org.jetbrains.kotlin:kotlin-noarg是無參（no-arg）編譯器插件，它爲具備特定註解的類生成一個額外的零參數構造函數。這個生成的構造函數是合成的，所以不能從 Java 或 Kotlin 中直接調用，但可使用反射調用。這樣咱們就可使用 Java Persistence API（JPA）實例化 data 類。

其中，org.jetbrains.kotlin:kotlin-allopen 是全開放編譯器插件。咱們使用Kotlin 調用Java的Spring AOP框架和庫，須要類爲 open（可被繼承實現），而Kotlin 類和函數都是默認 final 的，這樣咱們須要爲每一個類和函數前面加上open修飾符。

這樣的代碼寫起來，可費事了。還好，咱們有all-open 編譯器插件。它會適配 Kotlin 以知足這些框架的需求，並使用指定的註解標註類而其成員無需顯式使用 open 關鍵字打開。例如，當咱們使用 Spring 時，就不須要打開全部的類，跟咱們在Java中寫代碼同樣，只須要用相應的註解標註便可。

Kotlin 1.0.6 版本里提供了 kotlin-spring 插件，用下面的註解把Kotlin的類或成員函數設置爲open：

@Component

@Async

@Transactional

@Cacheable

這樣的註解支持，意味着咱們使用 @Configuration，@Controller，@RestController，@Service 或 @Repository 註解的類會自動設置爲 open ，由於這些註解都使用了@Component。

完整的build.gradle配置文件以下

group 'com.easy.kotlin'
version '1.0-SNAPSHOT'

buildscript {
    ext.kotlin_version = '1.1.2-2'
    ext.springboot_version = '1.5.2.RELEASE'

    repositories {
        mavenCentral()
    }
    dependencies {
//        Kotlin Gradle插件
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
//        SpringBoot Gradle插件
        classpath("org.springframework.boot:spring-boot-gradle-plugin:$springboot_version")

//        Kotlin整合SpringBoot的默認無參構造函數，默認把全部的類設置open類插件
//        無參（no-arg）編譯器插件爲具備特定註解的類生成一個額外的零參數構造函數。 這個生成的構造函數是合成的，所以不能從 Java 或 Kotlin 中直接調用，但可使用反射調用。 這容許 Java Persistence API（JPA）實例化 data 類，雖然它從 Kotlin 或 Java 的角度看沒有無參構造函數
        classpath("org.jetbrains.kotlin:kotlin-noarg:$kotlin_version")
//        全開放插件（kotlin-allopen）
        classpath("org.jetbrains.kotlin:kotlin-allopen:$kotlin_version")
    }
}

apply plugin: 'java'
apply plugin: 'kotlin'

//Kotlin整合SpringBoot須要的spring，jpa，org.springframework.boot插件

//Kotlin-spring 編譯器插件，它根據 Spring 的要求自動配置全開放插件。
apply plugin: 'kotlin-spring'
//該插件指定 @Entity 和 @Embeddable 註解做爲應該爲一個類生成無參構造函數的標記。
apply plugin: 'kotlin-jpa'
apply plugin: 'org.springframework.boot'

sourceCompatibility = 1.8
targetCompatibility = 1.8

repositories {
    mavenCentral()
}

dependencies {
    compile "org.jetbrains.kotlin:kotlin-stdlib-jre8:$kotlin_version"
    testCompile group: 'junit', name: 'junit', version: '4.12'

    compile("org.springframework.boot:spring-boot-starter-web")
    testCompile("org.springframework.boot:spring-boot-starter-test")
    compile("org.springframework.boot:spring-boot-starter-data-jpa")
    compile('mysql:mysql-connector-java:5.1.13')

}

配置application.properties

spring.datasource.url = jdbc:mysql://localhost:3306/easykotlin
spring.datasource.username = root
spring.datasource.password = root
#spring.datasource.driverClassName = com.mysql.jdbc.Driver
# Specify the DBMS
spring.jpa.database = MYSQL
# Keep the connection alive if idle for a long time (needed in production)
spring.datasource.testWhileIdle = true
spring.datasource.validationQuery = SELECT 1
# Show or not log for each sql query
spring.jpa.show-sql = true
# Hibernate ddl auto (create, create-drop, update)
spring.jpa.hibernate.ddl-auto = update
# Naming strategy
spring.jpa.hibernate.naming-strategy = org.hibernate.cfg.ImprovedNamingStrategy
# The SQL dialect makes Hibernate generate better SQL for the chosen database
spring.jpa.properties.hibernate.dialect = org.hibernate.dialect.MySQL5Dialect

server.port=8000

總體工程架構

UNIX操做系統說，「一切都是文件」。因此,咱們的全部的源代碼、字節碼、工程資源文件等等，一切都是文件。文件裏面存的是字符串（01也當作是字符）。各類框架、庫、編譯器，解釋器，都是對這些字符串流進行過濾，最後映射成01機器碼（或者CPU微指令碼等），最終落地到硬件上的高低電平。

總體工程目錄以下：

.
├── README.md
├── build
│   └── kotlin-build
│       └── caches
│           └── version.txt
├── build.gradle
├── easykotlin.sql
├── settings.gradle
└── src
    ├── main
    │   ├── java
    │   ├── kotlin
    │   │   └── com
    │   │       └── easy
    │   │           └── kotlin
    │   │               ├── Application.kt
    │   │               ├── controller
    │   │               │   ├── HelloWorldController.kt
    │   │               │   └── PeopleController.kt
    │   │               ├── entity
    │   │               │   └── People.kt
    │   │               ├── repository
    │   │               │   └── PeopleRepository.kt
    │   │               └── service
    │   │                   └── PeopleService.kt
    │   └── resources
    │       ├── application.properties
    │       └── banner.txt
    └── test
        ├── java
        ├── kotlin
        └── resources

19 directories, 13 files

一切盡在不言中，靜靜地看工程文件結構。

直接寫個HelloWorldController

package com.easy.kotlin.controller

import org.springframework.web.bind.annotation.GetMapping
import org.springframework.web.bind.annotation.RestController

/**
 * Created by jack on 2017/6/7.
 */
@RestController
class HelloWorldController {
    @GetMapping(value = *arrayOf("/helloworld", "/"))
    fun helloworld(): Any {
        return "Hello,World!"
    }
}

咱們再寫個訪問數據庫的標準四層代碼

寫領域模型類People

package com.easy.kotlin.entity

import java.util.*
import javax.persistence.Entity
import javax.persistence.GeneratedValue
import javax.persistence.GenerationType
import javax.persistence.Id

/**
 * Created by jack on 2017/6/6.
 */
@Entity
class People(
        @Id @GeneratedValue(strategy = GenerationType.AUTO)
        val id: Long?,
        val firstName: String?,
        val lastName: String?,
        val gender: String?,
        val age: Int?,
        val gmtCreated: Date,
        val gmtModified: Date
) {
    override fun toString(): String {
        return "People(id=$id, firstName='$firstName', lastName='$lastName', gender='$gender', age=$age, gmtCreated=$gmtCreated, gmtModified=$gmtModified)"
    }
}

寫PeopleRepository

package com.easy.kotlin.repository

import com.easy.kotlin.entity.People
import org.springframework.data.repository.CrudRepository

/**
 * Created by jack on 2017/6/7.
 */
interface PeopleRepository : CrudRepository<People, Long> {
    fun findByLastName(lastName: String): List<People>?
}

寫PeopleService

package com.easy.kotlin.service

import com.easy.kotlin.entity.People
import com.easy.kotlin.repository.PeopleRepository
import org.springframework.beans.factory.annotation.Autowired
import org.springframework.stereotype.Service

/**
 * Created by jack on 2017/6/7.
 */
@Service
class PeopleService : PeopleRepository {

    @Autowired
    val peopleRepository: PeopleRepository? = null


    override fun findByLastName(lastName: String): List<People>? {
        return peopleRepository?.findByLastName(lastName)
    }

    override fun <S : People?> save(entity: S): S? {
        return peopleRepository?.save(entity)
    }

    override fun <S : People?> save(entities: MutableIterable<S>?): MutableIterable<S>? {
        return peopleRepository?.save(entities)
    }

    override fun delete(entities: MutableIterable<People>?) {
    }

    override fun delete(entity: People?) {
    }

    override fun delete(id: Long?) {
    }

    override fun findAll(ids: MutableIterable<Long>?): MutableIterable<People>? {
        return peopleRepository?.findAll(ids)
    }

    override fun findAll(): MutableIterable<People>? {
        return peopleRepository?.findAll()
    }

    override fun exists(id: Long?): Boolean {
        return peopleRepository?.exists(id)!!
    }

    override fun count(): Long {
        return peopleRepository?.count()!!
    }

    override fun findOne(id: Long?): People? {
        return peopleRepository?.findOne(id)
    }

    override fun deleteAll() {
    }


}

寫PeopleController

package com.easy.kotlin.controller

import com.easy.kotlin.service.PeopleService
import org.springframework.beans.factory.annotation.Autowired
import org.springframework.stereotype.Controller
import org.springframework.web.bind.annotation.GetMapping
import org.springframework.web.bind.annotation.RequestParam
import org.springframework.web.bind.annotation.ResponseBody

/**
 * Created by jack on 2017/6/7.
 */
@Controller
class PeopleController {
    @Autowired
    val peopleService: PeopleService? = null

    @GetMapping(value = "/hello")
    @ResponseBody
    fun hello(@RequestParam(value = "lastName") lastName: String): Any {
        val peoples = peopleService?.findByLastName(lastName)
        val map = HashMap<Any, Any>()
        map.put("hello", peoples!!)
        return map
    }

}

運行測試

首先在本地mysql數據庫中新建schema

CREATE SCHEMA `easykotlin` DEFAULT CHARACTER SET utf8 ;

而後，點擊Gradle的bootRun , 以下圖

若是沒有異常，啓動成功，咱們將看到如下輸出：

打開瀏覽器，訪問請求：

http://127.0.0.1:8000/

輸出響應：

Hello,World!

訪問

http://127.0.0.1:8000/hello?l...

// 20170607115700
// http://127.0.0.1:8000/hello?lastName=chen

{
  "hello": [
    {
      "id": 1,
      "firstName": "Jason",
      "lastName": "Chen",
      "gender": "Male",
      "age": 28,
      "gmtCreated": 1496768497000,
      "gmtModified": 1496768497000
    },
    {
      "id": 3,
      "firstName": "Corey",
      "lastName": "Chen",
      "gender": "Female",
      "age": 20,
      "gmtCreated": 1496768497000,
      "gmtModified": 1496768497000
    }
    ...
  ]
}

本節示例工程源代碼：

https://github.com/EasyKotlin...

2.4 Android版的HelloWorld

2017谷歌I/O大會：宣佈 Kotlin 成 Android 開發一級語言。

2017谷歌I/O大會上，谷歌宣佈，將Kotlin語言做爲安卓開發的一級編程語言。Kotlin由JetBrains公司開發，與Java100%互通，並具有諸多Java尚不支持的新特性。谷歌稱還將與JetBrains公司合做，爲Kotlin設立一個非盈利基金會。

JetBrains在2010年首次推出Kotlin編程語言，並在次年將之開源。下一版的AndroidStudio（3.0）也將提供支持。

下面咱們簡要介紹如何在Android上開始一個Kotlin的HelloWorld程序。

對於咱們程序員來講，咱們正處於一個美好的時代。得益於互聯網的發展、工具的進步，咱們如今學習一門新技術的成本和難度都比過去低了不少。

假設你以前沒有使用過Kotlin，那麼從頭開始寫一個HelloWorld的app也只須要這麼幾步：

首先，你要有一個Android Studio。
本節中，咱們用的是2.2.3版本，其它版本應該也大同小異。

Android Studio 2.3.1
Build #AI-162.3871768, built on April 1, 2017
JRE: 1.8.0_112-release-b06 x86_64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o

其次，安裝一個Kotlin的插件。

依次打開：Android Studio > Preferences > Plugins，

而後選擇『Browse repositories』，在搜索框中搜索Kotlin，結果列表中的『Kotlin』插件，以下圖

點擊安裝，安裝完成以後，重啓Android Studio。

新建一個Android項目

從新打開Android Studio，新建一個Android項目吧，添加一個默認的MainActivity——像之前同樣便可。

轉換Java to Kotlin

安裝完插件的AndroidStudio如今已經擁有開發Kotlin的功能。咱們先來嘗試它的轉換功能：Java -> Kotlin，能夠把現有的java文件翻譯成Kotlin文件。

打開MainActivity文件，在Code菜單下面能夠看到一個新的功能：Convert Java File to Kotlin File。

點擊轉換，

能夠看到轉換後的Kotlin文件：MainActivity.kt

package com.kotlin.easy.kotlinandroid

import android.support.v7.app.AppCompatActivity
import android.os.Bundle

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }
}

這個轉換功能，對咱們Java程序員在學習Kotlin是十分實用。咱們能夠基於咱們以前的Java編碼的經驗來迅速學習Kotlin編程。

配置gradle文件

MainActivity已經被轉換成了Kotlin實現，可是項目目前gradle編譯、構建、運行還不能執行，還須要進一步配置一下，讓項目支持grade的編譯、運行。固然，這一步也不須要咱們作太多工做——IDEA都已經幫咱們作好了。

在Java代碼轉換成Kotlin代碼以後，打開MainActivity.kt文件，編譯器會提示"Kotlin not configured"，點擊一下Configure按鈕，IDEA就會自動幫咱們把配置文件寫好了。

咱們能夠看出，主要的依賴項是：

kotlin-gradle-plugin
plugin: 'kotlin-android'
kotlin-stdlib-jre7

完整的配置文件以下：

Project build.gradle

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ext.kotlin_version = '1.1.2-4'
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.3.1'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"

        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        jcenter()
    }
}

task clean(type: Delete) {
    delete rootProject.buildDir
}

Module build.gradle

apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'

android {
    compileSdkVersion 25
    buildToolsVersion "25.0.2"
    defaultConfig {
        applicationId "com.kotlin.easy.kotlinandroid"
        minSdkVersion 14
        targetSdkVersion 25
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    compile 'com.android.support:appcompat-v7:25.3.1'
    compile 'com.android.support.constraint:constraint-layout:1.0.2'
    testCompile 'junit:junit:4.12'
    compile "org.jetbrains.kotlin:kotlin-stdlib-jre7:$kotlin_version"
}
repositories {
    mavenCentral()
}

因此說使用IDEA來寫Kotlin代碼，這工具的完美集成會讓你用起來如絲般潤滑。畢竟Kotlin的親爸爸JetBrains是專門作工具的，並且Intelli IDEA又是那麼敏捷、智能。

配置以後，等Gradle Sync完成，便可運行。

6.運行

運行結果以下

工程源碼：https://github.com/EasyKotlin...

2.5 JavaScript版HelloWorld

在Kotlin 1.1中，開始支持JavaScript和協程是引人注目的亮點。本節咱們簡單介紹Kotlin代碼編譯轉化爲JavaScript的方法。

爲了極簡直觀地感覺這個過程，咱們先在命令行REPL環境體驗一下Kotlin源碼被編譯生成對應的JavaScript代碼的過程。

首先，使用編輯器新建一個HelloWord.kt

fun helloWorld(){
    println("Hello,World!")
}

命令行使用kotlinc-js編譯

kotlinc-js -output HelloWorld.js HelloWorld.kt

運行完畢，咱們會在當前目錄下看到HelloWorld.js, 其內容以下

if (typeof kotlin === 'undefined') {
  throw new Error("Error loading module 'HelloWorld'. Its dependency 'kotlin' was not found. Please, check whether 'kotlin' is loaded prior to 'HelloWorld'.");
}
var HelloWorld = function (_, Kotlin) {
  'use strict';
  var println = Kotlin.kotlin.io.println_s8jyv4$;
  function helloWorld() {
    println('Hello,World!');
  }
  _.helloWorld = helloWorld;
  Kotlin.defineModule('HelloWorld', _);
  return _;
}(typeof HelloWorld === 'undefined' ? {} : HelloWorld, kotlin);

咱們看到，使用kotlinc-js 轉換成的js代碼依賴'kotlin'模塊。這個模塊是Kotlin支持JavaScript腳本的內部封裝模塊。也就是說，若是咱們想要使用HelloWorld.js，先要引用kotlin.js。這個kotlin.js 在kotlin-stdlib-js-1.1.2.jar裏面。

下面咱們使用IDEA新建一個Kotlin（JavaScript）工程。在這個過程當中，咱們將會看到使用Kotlin來開發js的過程。

首先按照如下步驟新建工程

等待Gradle初始化工程完畢，咱們將獲得一個Gradle KotlinJS 工程，其目錄以下

.
├── build
│   └── kotlin-build
│       └── caches
│           └── version.txt
├── build.gradle
├── settings.gradle
└── src
    ├── main
    │   ├── java
    │   ├── kotlin
    │   └── resources
    └── test
        ├── java
        ├── kotlin
        └── resources

12 directories, 3 files

其中，build.gradle配置文件爲

group 'com.easy.kotlin'
version '1.0-SNAPSHOT'

buildscript {
    ext.kotlin_version = '1.1.2'

    repositories {
        mavenCentral()
    }
    dependencies {
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }
}

apply plugin: 'kotlin2js'

repositories {
    mavenCentral()
}

dependencies {
    compile "org.jetbrains.kotlin:kotlin-stdlib-js:$kotlin_version"
}

其中，apply plugin: 'kotlin2js' 是Gradle的kotlin編譯成js的插件。org.jetbrains.kotlin:kotlin-stdlib-js是KotlinJS的運行庫。

另外，咱們須要再配置一下Kotlin代碼編譯成JS的編譯規則，以及文件放置目錄等屬性，以下所示

build.doLast {
    configurations.compile.each { File file ->
        copy {
            includeEmptyDirs = false

            from zipTree(file.absolutePath)
            into "${projectDir}/web"
            include { fileTreeElement ->
                def path = fileTreeElement.path
                path.endsWith(".js") && (path.startsWith("META-INF/resources/") || !path.startsWith("META-INF/"))
            }
        }
    }
}

compileKotlin2Js {
    kotlinOptions.outputFile = "${projectDir}/web/js/app.js"
    kotlinOptions.moduleKind = "plain" // plain (default),AMD,commonjs,umd
    kotlinOptions.sourceMap = true
    kotlinOptions.verbose = true
    kotlinOptions.suppressWarnings = true
    kotlinOptions.metaInfo = true
}

其中，kotlinOptions.moduleKind配置項是Kotlin代碼編譯成JavaScript代碼的類型。支持普通JS（plain），AMD(Asynchronous Module Definition，異步模塊定義)、CommonJS和UMD(Universal Model Definition，通用模型定義)。

AMD一般在瀏覽器的客戶端使用。AMD是異步加載模塊，可用性和性能相對會好。

CommonJS是服務器端上使用的模塊系統，一般用於nodejs。

UMD是想綜合AMD、CommonJS這兩種模型，同時支持它們在客戶端或服務器端上使用。

咱們這裏爲了極簡化演示，直接採用了普通JS plain 類型。

除了輸出的 JavaScript 文件，該插件默認會建立一個帶二進制描述符的額外 JS 文件。若是你是構建其餘 Kotlin 模塊能夠依賴的可重用庫，那麼該文件是必需的，而且應該與轉換結果一塊兒分發。其生成由 kotlinOptions.metaInfo 選項控制。

一切配置完畢，咱們來寫Kotlin代碼App.kt

package com.easy.kotlin

/**
 * Created by jack on 2017/6/7.
 */

fun helloWorld() {
    println("Hello,World!")
}

而後，咱們直接使用Gradle構建工程，以下圖所示

控制檯輸出

23:47:05: Executing external task 'build'...
Using a single directory for all classes from a source set. This behaviour has been deprecated and is scheduled to be removed in Gradle 5.0
    at build_3e0ikl0qk0r006tvk0olcp2lu.run(/Users/jack/easykotlin/chapter2_hello_world_kotlin2js/build.gradle:15)
:compileJava NO-SOURCE
:compileKotlin2Js
:processResources NO-SOURCE
:classes
:jar
:assemble
:compileTestJava NO-SOURCE
:compileTestKotlin2Js NO-SOURCE
:processTestResources NO-SOURCE
:testClasses UP-TO-DATE
:test NO-SOURCE
:check UP-TO-DATE
:build

BUILD SUCCESSFUL in 2s
3 actionable tasks: 3 executed
23:47:08: External task execution finished 'build'.

此時，咱們能夠看到工程目錄變爲

.
├── build
│   └── kotlin-build
│       └── caches
│           └── version.txt
├── build.gradle
├── settings.gradle
└── src
    ├── main
    │   ├── java
    │   ├── kotlin
    │   └── resources
    └── test
        ├── java
        ├── kotlin
        └── resources

12 directories, 3 files
jack@jacks-MacBook-Air:~/easykotlin/chapter2_hello_world_kotlin2js$ tree ..
├── build
│   ├── kotlin
│   │   └── sessions
│   ├── kotlin-build
│   │   └── caches
│   │       └── version.txt
│   ├── libs
│   │   └── chapter2_hello_world_kotlin2js-1.0-SNAPSHOT.jar
│   └── tmp
│       └── jar
│           └── MANIFEST.MF
├── build.gradle
├── settings.gradle
├── src
│   ├── main
│   │   ├── java
│   │   ├── kotlin
│   │   │   └── com
│   │   │       └── easy
│   │   │           └── kotlin
│   │   │               └── App.kt
│   │   └── resources
│   └── test
│       ├── java
│       ├── kotlin
│       └── resources
└── web
    ├── js
    │   ├── app
    │   │   └── com
    │   │       └── easy
    │   │           └── kotlin
    │   │               └── kotlin.kjsm
    │   ├── app.js
    │   ├── app.js.map
    │   └── app.meta.js
    ├── kotlin.js
    └── kotlin.meta.js

26 directories, 14 files

這個web目錄就是Kotlin代碼經過kotlin-stdlib-js-1.1.2.jar編譯的輸出結果。

其中，app.js代碼以下

if (typeof kotlin === 'undefined') {
  throw new Error("Error loading module 'app'. Its dependency 'kotlin' was not found. Please, check whether 'kotlin' is loaded prior to 'app'.");
}
var app = function (_, Kotlin) {
  'use strict';
  var println = Kotlin.kotlin.io.println_s8jyv4$;
  function helloWorld() {
    println('Hello,World!');
  }
  var package$com = _.com || (_.com = {});
  var package$easy = package$com.easy || (package$com.easy = {});
  var package$kotlin = package$easy.kotlin || (package$easy.kotlin = {});
  package$kotlin.helloWorld = helloWorld;
  Kotlin.defineModule('app', _);
  return _;
}(typeof app === 'undefined' ? {} : app, kotlin);

//@ sourceMappingURL=app.js.map

裏面這段自動生成的代碼顯得有點繞

var package$com = _.com || (_.com = {});
  var package$easy = package$com.easy || (package$com.easy = {});
  var package$kotlin = package$easy.kotlin || (package$easy.kotlin = {});
  package$kotlin.helloWorld = helloWorld;
  
  Kotlin.defineModule('app', _);
  return _;

簡化以後的意思表達以下

_.com.easy.kotlin.helloWorld = helloWorld;

目的是創建Kotlin代碼跟JavaScript代碼的映射關係。這樣咱們在前端代碼中調用

function helloWorld() {
    println('Hello,World!');
  }

這個函數時，只要這樣調用便可

app.com.easy.kotlin.helloWorld()

下面咱們來新建一個index.html頁面，使用咱們生成的app.js。代碼以下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>KotlinJS</title>

</head>
<body>


<!-- 優先加載kotlin.js，再加載應用程序代碼app.js-->
<script type="text/javascript" src="kotlin.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="js/app.js"></script>

<script>
    var kotlinJS = app;
    console.log(kotlinJS.com.easy.kotlin.helloWorld())
</script>
</body>
</html>

咱們須要優先加載kotlin.js，再加載應用程序代碼app.js。
固然，咱們仍然能夠像之前同樣使用諸如jquery.js這樣的庫。

在瀏覽器中打開index.html

咱們能夠看到瀏覽器控制檯輸出

這個helloWorld() JavaScript函數

var println = Kotlin.kotlin.io.println_s8jyv4$;
  function helloWorld() {
    println('Hello,World!');
  }

對應kotlin.js代碼中的3755行處的代碼：

BufferedOutputToConsoleLog.prototype.flush = function() {
    console.log(this.buffer);
    this.buffer = "";
  };

本節工程源代碼：https://github.com/EasyKotlin...

本章小結

本章簡單介紹了Kotlin分別使用命令行、應用程序、Web RESTFul、Android、Kotlin JavaScript等平臺上的快速開發入門的Hello,World示例。

Kotlin是靜態類型編程語言，支持多個平臺：JVM平臺，Android平臺，瀏覽器JS，本地機器碼等平臺。與Java，Android 100%互通。

從Web RESTFul的示例中，咱們也能夠了解到Kotlin能夠基本無縫使用Java生態庫（有的使用場景，想要優雅地編程，可能須要插件支持，好比說咱們講到的no-args,allopen插件）。Android開發無縫使用Java庫也是相似的。

而後，咱們還能夠看到，使用Kotlin代碼來自動生成對應JS代碼的有趣體驗。

前兩章中，咱們從總體上了解了Kotlin語言背景，體驗了在多平臺上使用Kotlin語言進行快速開始Hello，World的開發過程。在下一章節中，咱們將走進Kotlin語言的基礎學習。

參考資料

1.https://kotlinlang.org/docs/r...

2.http://kotlinlang.org/docs/tu...

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

第2章快速開始：HelloWorld 《Kotlin 極簡教程》

第2章快速開始：HelloWorld

《Kotlin極簡教程》正式上架：

點擊這裏 > 去京東商城購買閱讀

點擊這裏 > 去天貓商城購買閱讀

很是感謝您親愛的讀者，你們請多支持！！！有任何問題，歡迎隨時與我交流~

2.1 命令行版HelloWorld

2.2 應用程序版HelloWorld

2.3 Web RESTFul HelloWorld

2.4 Android版的HelloWorld

2.5 JavaScript版HelloWorld

本章小結

參考資料

第2章 快速開始：HelloWorld 《Kotlin 極簡教程》

第2章 快速開始：HelloWorld

《Kotlin極簡教程》正式上架：

點擊這裏 > 去京東商城購買閱讀

點擊這裏 > 去天貓商城購買閱讀

很是感謝您親愛的讀者，你們請多支持！！！有任何問題，歡迎隨時與我交流~

2.1 命令行版HelloWorld

2.2 應用程序版HelloWorld

2.3 Web RESTFul HelloWorld

2.4 Android版的HelloWorld

2.5 JavaScript版HelloWorld

本章小結

參考資料

第2章快速開始：HelloWorld 《Kotlin 極簡教程》

第2章快速開始：HelloWorld