-->

2015年07月

[Node.js] TypeScriptをインストール(OS X)で最後にNode.jsの型定義ファイルを取得する方法を書いたけど、2015/7/7時点での最新のやつを使ってみるとこんなエラーが出た(^^;)
追記にしようかと思ったけど、長くなったので別の投稿にした。

typings/node/node.d.ts(260,26): error TS2304: Cannot find name 'DataView'.
typings/node/node.d.ts(274,21): error TS2304: Cannot find name 'Map'.
typings/node/node.d.ts(283,21): error TS2304: Cannot find name 'Set'.
typings/node/node.d.ts(293,25): error TS2304: Cannot find name 'WeakMap'.

いろいろ調べてみると、エラーになっているのはES6で追加されるやつっぽい。
回避方法に--target es6とか付けてコンパイルすればいいとか、あったんだけど別のエラー出るし・・・。それを回避するにはさらに〜.d.tsファイルのimportのところをES6の変えてまわるって・・・。この方法を書かれていたブログのコメントにあった方法を参考にいろいろやってみた。
ES5のまま、ES6のlib.es6.d.tsを参照するというものだ。
次のようなtsconfig.jsonをプロジェクトのディレクトリに作る。

{
        "version": "1.5.0-beta",
        "compilerOptions": {
                "module": "commonjs",
                "target": "es5",
                "noLib": true
        },
        "files":[
                "/usr/local/lib/node_modules/typescript/bin/lib.es6.d.ts",
                "./test.ts"
        ]
}

tsconfig.jsonは、IDEなんかであるプロジェクトファイルやMakefileにあたるようなものだ。
見ればわかると思うが、コンパイラーオプションのnoLibオプションでデフォルトのlib.d.tsを使わないようにして、filesにlib.es6.d.tsを入れる。lib.es6.d.tsの場所はNode.jsやTypeScriptをインストールした場所によって変わってくるので自分の環境での場所に置き換えてくれ!
test.tsは作ろーとしているアプリのTypeScriptのファイルだ。

で、ターミナルで

$ tsc

とやると、コンパイルされて、test.jsができる。
試していないけど、targetにes5を指定してるのでSetやMapは当然使えないだろうな。

もう一つ、回避方法を書いておく。
よーは、ES6で追加された要素が含まれる前のバージョンの型定義ファイルを使う方法だ。(これは、これでなんか問題あるかもしれんが)
たぶん、現時点で1つ古いバーションの0.11.0を入れてみる。
プロジェクトのフォルダで次のようにtsdを実行する。

$ tsd install node -ors --semver=0.11.0

すると、"./typings/node/node-0.11.d.ts"ができる。
tsファイルのあたまに

// <reference path="./typings/node/node-0.11.d.ts" />

を付けるとエラーにならなくなる。
さっきのtsconfig.jsonを使う場合、noLibのところはfalseにlib.es6.d.tsの行は削除する。

さて、どっちがいいんだろうか。

(追記 2015/8/29)
今日、tsd使ってnode.jsの型定義ファイルを取得して試してみると、うまいこといった。あっ、この投稿で試したのはTypeScript 1.5.0-betaか、今はTypeScriptも1.5.3になってる。



このエントリーをはてなブックマークに追加

Macでも使いたくてTypeScriptをインストールしてみた。

node.jsはインストール済みとして(^^;)、次のコマンドを実行する。

$ sudo npm install -g typescript

ちゃんと、インストールされているか試す。
hello.tsと言うファイル名で次のリストを保存する。

//  console.log("Hello world");
// だけでいいんだけど、TypeScriptっぽくないので
// むだなことをやってみてるw
class Hello {
        public print():void {
                console.log("Hello world");
        }
}

var hello = new Hello();
hello.print();

コマンドラインで次のコマンドを実行すると、hello.jsと言う、JavaScriptのファイルができる。

$ tsc hello.ts

で、

$ node hello.js

を実行すると、"Hello world"と表示される。

次に実際に使おうと思うと、JavaScriptライブラリの型定義ファイルが必要なんだが、それを入手するツール(TypeScript Definition manager)をインストールする。

$ sudo npm install tsd -g

Node.jsの型定義ファイルを取得するには、プロジェクトのディレクトリに移動して、次のコマンドを一回実行して初期化する。

$ tsd init

定義ファイルを取得するには、

$ tsd install node -ors

を実行する。
定義ファイルは"./typings/node/node.d.ts"になる。

(追記 2015/7/9)
長くなったので別エントリ([Node.js] TypeScriptをインストール(OS X) (追記))にした。



このエントリーをはてなブックマークに追加

↓こんな感じのTwitterのタイムラインみたいなリストを作ってみる。

59
まず、このデータのクラスを作る。

public class Article {
    private String user;        // ユーザ名
    private String comment;     // コメント
    private Image image;        // アイコン
    
    public String getUser() {
        return user;
    }
    public void setUser(String user) {
        this.user = user;
    }
    
    public String getComment() {
        return comment;
    }
    public void setComment(String comment) {
        this.comment = comment;
    }
    
    public Image getImage() {
        return image;
    }
    public void setImage(Image image) {
        this.image = image;
    }
    
    public Article(Image image, String user, String comment) {
        this.user = user;
        this.comment = comment;
        this.image = image;
    }
    
}

セルを作るクラスを作る。コンストラクタでコントロールやコンテナを作成して、updateItem()で値だけをできるだで更新する。図のようにHBoxにImageViewとVBoxを追加して、VBoxにはユーザ名用のTextとコメント用のTextを追加する。
無題 1
 

public class ArticleCell extends ListCell<Article> {
    private final HBox hbox;
    private final ImageView imageView;
    private final VBox vbox;
    private final Text user;
    private final Text comment;
    
    public ArticleCell() {
        hbox = new HBox(5);
        imageView = new ImageView();
        imageView.setFitWidth(64);
        imageView.setFitHeight(64);
        
        vbox = new VBox(5);
        user = new Text();
        user.setFont(new Font("System Bold", 18));
        comment = new Text();
        VBox.setVgrow(user, Priority.NEVER);
        VBox.setVgrow(comment, Priority.ALWAYS);
        HBox.setHgrow(imageView, Priority.NEVER);
        HBox.setHgrow(vbox, Priority.ALWAYS);
        vbox.getChildren().addAll(user, comment);
        hbox.getChildren().addAll(imageView, vbox);
        // ユーザ名、コメントをVBoxの幅-5になるようにバインドしとく
        user.wrappingWidthProperty().bind(vbox.widthProperty().subtract(5));
        comment.wrappingWidthProperty().bind(vbox.widthProperty().subtract(5));
    }

    @Override
    protected void updateItem(Article item, boolean empty) {
        super.updateItem(item, empty);
        
        if(empty) {
            setText(null);
            setGraphic(null);
        } else {
            imageView.setImage(item.getImage());
            user.setText(item.getUser());
            comment.setText(item.getComment());
            setGraphic(hbox);
        }
    }
    
}

カスタムセルを作るようにFXMLDocumentControllerのinitializeで

        listView.setCellFactory(param -> new ArticleCell());

をしておく。

ソースおいておく。


このエントリーをはてなブックマークに追加

2つの変数が同一インスタンスかどうかは、===と!==で判定する。

class Hoge {
    // プロパティ
    var hoge:Int = 3
}

// インスタンスの生成
var hoge1 = Hoge()
var hoge2 = hoge1

if hoge1 === hoge2 {
    println("同一インスタンスだ")        // 表示される
}
if hoge1 !== hoge2 {
    println("同一インスタンスでない")      // 表示されない
}

このエントリーをはてなブックマークに追加

↑このページのトップヘ