コンテンツへスキップ

JavaScriptで静的型付けを実現できる代替言語まとめ

by : 2017/04/21

JavaScriptを使っていて常に悩みのタネなのが変数の型付けです。スクリプト言語に慣れた方であれば気にならないかも知れませんが、サーバサイドやアプリ開発でコンパイルするのに慣れているプログラマーにとっては書いていて不安に感じる点もあるでしょう。

そこで今回はJavaScriptの代替言語の中でも静的型付けをサポートするものを紹介します。

Haxe

HaxeはJavaScriptだけでなくJava、C++、PHP、C#、Python、ActionScript3などに変換できます。例えば次のようなコードになります。

@:generic
class MyValue<T> {
public var value:T;
public function new(value:T) {
this.value = value;
}
}
class Main {
static public function main() {
var a = new MyValue<String>("Hello");
var b = new MyValue<Int>(42);
}
}

view raw
index.hxml
hosted with ❤ by GitHub

開発対象としてはiOS/Androidを含め、サーバサイドまで幅広く対応します。

Home – Haxe – The Cross-platform Toolkit

elm

elmで書く場合、HTML/JavaScript/CSSを直接書くことはできません。すべてelm上で提供されるので、Webアプリケーション全体の記述ができます。ベースになっているのはHaskellで強力な静的型付けが特徴になっています。

コード例ですが、これで表示まで含めてサポートされます。

Read more about this program in the official Elm guide:
https://guide.elm-lang.org/architecture/user_input/buttons.html
import Html exposing (beginnerProgram, div, button, text)
import Html.Events exposing (onClick)
main =
beginnerProgram { model = 0, view = view, update = update }
view model =
div []
[ button [ onClick Decrement ] [ text "" ]
, div [] [ text (toString model) ]
, button [ onClick Increment ] [ text "+" ]
]
type Msg = Increment | Decrement
update msg model =
case msg of
Increment ->
model + 1
Decrement ->
model 1

view raw
index.hs
hosted with ❤ by GitHub

home

Kotlin

主にAndroidアプリを開発するのに用いられるKotlinですが、JavaScriptとして変換もできます。Androidで動作するレベルでの静的型付けがWeb上でも可能となっています。

/**
* A reference must be explicitly marked as nullable to be able hold a null.
* See http://kotlinlang.org/docs/reference/null-safety.html#null-safety
*/
package multiplier
// Return null if str does not hold a number
fun parseInt(str: String): Int? {
try {
return str.toInt()
} catch (e: NumberFormatException) {
println("One of the arguments isn't Int")
}
return null
}
fun main(args: Array<String>) {
if (args.size < 2) {
println("No number supplied");
} else {
val x = parseInt(args[0])
val y = parseInt(args[1])
// We cannot say 'x * y' now because they may hold nulls
if (x != null && y != null) {
print(x * y) // Now we can
} else {
println("One of the arguments is null")
}
}
}

view raw
index.kts
hosted with ❤ by GitHub

Kotlinの開発元はJetBrainsとなっています。

Kotlin Programming Language

RapydScript

RapydScriptはPythonにインスパイアされたaltJSになります。型を定義せずに記述もできますが、定義することで間違った使い方をした際にエラーを起こすこともできます。

def optimizeMe(a: Number, b:Number) -> Number:

view raw
index.py
hosted with ❤ by GitHub

Pythonの書き方に慣れた方はCoffeeScriptよりも手軽に使えるかも知れません。

RapydScript | Pythonic JavaScript that doesn't suck

Flow

既存のコードに対して型定義を行い、ビルド時に除去することによって既存のコードに影響を与えずに型付け機能だけを追加できます。

// @flow
function square(n: number): number {
return n * n;
}
square("2", "2"); // Error!

view raw
index.js
hosted with ❤ by GitHub

開発する言語自体は変えずに追加できるのが便利です。

Flow: A Static Type Checker for JavaScript

TypeScript

Microsoftが開発し、Googleの社内標準言語にも取り入れられたaltJSです。Visual Studio Codeとの親和性も高く、入力補完機能なども便利に使えます。より大規模な開発に向いています。

class Greeter {
constructor(public greeting: string) { }
greet() {
return "<h1>" + this.greeting + "</h1>";
}
};
var greeter = new Greeter("Hello, world!");
document.body.innerHTML = greeter.greet();

view raw
index.ts
hosted with ❤ by GitHub

ECMAScript2017の先進的な機能も取り込まれているので、より新しいJavaScriptの機能を使っていきたいという方にもぴったりです。

TypeScript – JavaScript that scales.


業務システムであったり、エンタープライズ寄りになればなるほど、開発規模が大きくなって参加するプログラマも多くなります。そうした中ではスクリプト言語の変数の型が決まっていない開発は混乱をきたすこともあります。

今回紹介したような言語を使ってWebシステム開発を効率化してください。

banner_02

From → まとめ

コメントは受け付けていません。

%d人のブロガーが「いいね」をつけました。