新たなKineticデバイス「LEAP」の注文をするなど

彗星の如く登場して各界を賑わせているLEAPについて．

Leap Motion
https://live.leapmotion.com/index.html

公式サイトから読み取れる事

• マウスの代りになるデバイスである
• iPodサイズでUSBでコンピューターに接続して使う
• 小売価格は69.99USドル
• 既存の3Dセンサーの100倍以上の精度
• MaxOS, Windows7, Windows8 に対応

今できる事

• プレオーダー (発送は 2012年12月か2013年1月)
• 開発者登録

日本への発送だと，送料込みで82.98USDになります．とりあえず一台注文して開発者登録をしておきました．SDKの入手には開発者登録が必要の様です．

Struct.js ver. 0.3をリリースしました

欲しかった機能が実装できたのでタグを切りました。

hagino3000/Struct.js
https://github.com/hagino3000/Struct.js

主な機能追加

• ネストした構造のサポート
• nullableオプションの追加
• カスタムバリデーション関数のサポート
• 設定で全チェックを無効化する機能を追加
• 初期作成時の値チェックを追加

型チェックのためのコーディングをなるべく増やさない、というポリシーです。なので、素のObjectと同様に扱えるが必要なチェック機構は備えている、という物を目指しています。しかし副作用としてプロパティの有無でそれが何であるかを判定するダックタイピングは不可能になってしまったので、そこだけは Struct.getType(obj) を使います。

リリース用の設定

Proxyオブジェクトを生成しないので、通常のプロパティアクセスのコストだけになる。

Struct.configure({
  // 全てのチェック無効化
  'disable any check': true
});

バリデーション関数のサポート

Struct.define('Size', {
  width:  {type: 'number', cond: 'v >= 0'},
  height: {type: 'number', cond: function(v){return v >= 0} /*same as ↑*/}
});

var size = Struct.create('Size', {
  width: 0,
  height: 0
});

ネスト構造のサポート

Struct.create にネストしたObjectをそのまま食わせても大丈夫。

Struct.define('Position', {
  x: {type: 'number', nullable: false},
  y: {type: 'number', nullable: false}
});

Struct.define('Size', {
  width:  {type: 'number', nullable: false, cond: 'v >= 0'},
  height: {type: 'number', nullable: false, cond: 'v >= 0'}
});

Struct.define('Rect', {
  pos:  {type: 'struct:Position', nullable: false},
  size: {type: 'struct:Size', nullable: false},
  createdAt: {type: 'date', writable: false}
});

var rect = Struct.create('Rect', {
  pos: {x: 0, y: 0},
  size: {width: 100, height: 100},
  createdAt: new Date()
});

rect.pos.x = "200"; // => type mismatch error
rect.size.height = -1; // => condition formula validation error

今後の予定

次は関数呼び出しのパラメータチェックを実装する予定。

JavaScriptでrubyのmethod_missingを実装する

追記: Firefoxの実装で既に有る__noSuchMethod__に名前は合せた方が良い、というコメントを頂いたので名前を変えました。

何の役に立つか不明だけど書いてみた*1。Proxyでプロパティアクセスをフックして、存在しない場合は用意しておいた関数プロキシを返す。

上記の処理が書いてあるのはこの部分。

function enableMethodMissing(obj) {
  // 関数プロキシの作成
  var functionHandler = createBaseHandler({});
  functionHandler.get = function(receiver, name) {
  // プロパティアクセスの場合は何も返さない
    return function(){};
  }

  var calledProperty;
  var trapFn = Proxy.createFunction(functionHandler, function() {
    // 実行の場合は obj.methodMissing を呼び出す
    return obj.__noSuchMethod__(calledProperty, Array.prototype.slice.call(arguments));
  });

  // プロパティプロキシの作成
  var propertyAccessHandler = createBaseHandler(obj);
  propertyAccessHandler.get = function(receiver, name) {
    if (obj[name]) {
      return obj[name];
    } else {
      // 存在しないプロパティへのアクセスは関数プロキシを返す
      calledProperty = name;
      return trapFn;
    }
  }
  return Proxy.create(propertyAccessHandler);

// (略)

method_missing用の関数をわざわざProxy.createFunctionしているのは、プロパティアクセスの時はundefinedを返す、関数呼び出しの時はmethod_missing用の関数実行と処理を分けるため。
Proxyが何に使えるか、というのはこの動画がわかりやすかった。

*1：Firefox4以降 or JavaScriptの実験機能を有効にしたChromeでのみ動作します。

ChromeでECMAScript 6のProxyを有効にする

ECMAScript 6(候補)のProxyはChromeのデフォルト状態では使えない、前の記事で紹介したStruct.jsはProxyを使っているため、Chromeでチェック機構を有効にするには設定をいじる必要があります。

手順

アドレスバーからchrome://flagsを開く



JavaScript の試験運用機能を有効にする の所で「有効にする」をクリック



chromeを再起動

動作確認

こんなコードでOK

> typeof(Proxy); // => object
> typeof(Proxy.create); // => function

ただ、これだけではいろいろと足りない物があるので、同時にECMAScript 6のメソッドを補完してくれる es6-shim.js を使うと良いです。

JavaScriptで厳格な型チェックを行なうライブラリを書いた

(追記) Version 0.3をリリースしました。

先日のjava-ja温泉で「JavaScriptは独りでヒャッハーするのには良いけど、複数人で開発しだすと途端にカオスになって苦労する」という話になった。それに対する解の一つはClosure Compilerが採用したアノテーションによる型の定義と静的チェックだろう。それとは別のアプローチで何かできないかなと考えていたら、ECMAScript 6にObjectのプロパティアクセスをフックできる仕組み(Proxy.create)があったのを思い出した。Proxy APIを使ってみたら型チェックが効くC言語の構造体みたいな物が作れたのでライブラリ化した。

hagino3000/Struct.js
https://github.com/hagino3000/Struct.js

これを使うと何が良いかというと

obj = {};
obj.hogeFuga = new Foo();

// do something

obj.hoge_fuga = null; // 不要になったので解放 (タイプミス)

といった、動かしてもすぐには気づきにくいミスに例外を投げてくれる。Object.seal でも良いけど、未定義プロパティのreadに対しては何もしてくれないのが不満だったので、それも例外が飛ぶようにした。

使い方は次の通り。Object.defineProperties に似せた。

// 構造体の定義
Struct.define('Position', {
x: {type: 'number'},
y: {type: 'number'}
});

Struct.define('Square', {
name: {type: 'string', writable: false},
pos: {type: 'struct:Position'},
hidden: {type: 'boolean'}
});

// 作成
var sq = Struct.create('Square', {
name: 'mySquare',
hidden: true
});

// 通常のObjectと同様に扱える
sq.pos = Struct.create('Position', {x: 10, y: 20});
sq.hidden = false;
console.log(sq.name); // => mySquare
console.log(sq.pos.x); // => 10

// 以降の操作は全てチェックエラー
var name = sq.Name; // 未定義プロパティの読み取り
delete sq.Name; // 未定義プロパティのdelete
sq.visible = true; // プロパティの追加
sq.pos.x = "100"; // 型の不一致
sq.name = "hoge"; // 読み取り専用プロパティの変更

動作にはECMAScript 6 のProxyが必要なので、Firefox or 設定をいじったChromeじゃないと動かない。しかしProxyが無くても例外が飛ばないだけなので問題は無い、開発時にエラーが飛んでくれればそれで良いと考えているので。

(追記) ChromeでProxyを有効にする方法を書きました。