ヴィンランド・サガ (18) を読んだ

読んだ。

トルフィンが「本当の戦士」に近づいていることをいたるところでアピールしている巻だった。 (「本当の戦士」ってよく分かっていないけど ) この漫画、戦闘の緊迫している状況の描き方が秀逸で、あっという間に一冊読み終わってしまう。

ES2015のarrow functionsはargumentsを束縛しない

題の通りで、何かのES2015の紹介記事に書いてあった気がするんだが、いざコードを書く時にすっかり忘れていた。

() => {
  console.log(typeof arguments) // undefined
}

MDNの記事を読んだら( アロー関数 - JavaScript | MDN )、ES2015のrest parametersで代用できるよ、とのこと。

(...args) => {
  console.log(typeof args) // object
  console.log(Array.isArray(args)) // true
}

arguments、ライブラリを作っていて可変長引数をやりたい場合に使うのだけど、これが「Arrayのような」オブジェクトで push や pop といったメソッドが使えない。これを解決するためのイディオムとして、以下のように arguments を配列に変換するのだけど、知らない人が見たら、何だこれは、という気持ちになる。

var args = Array.prototype.slice.call(arguments);

一方、rest parameters の方は普通の配列なので「Arrayのような」オブジェクトかどうか気にしなくてもよい。ES2015の仕様が当たり前に使える世界になったら(そうなりつつあるが)、可変長引数の用途では arguments を使わず、rest parameters でいいのかもしれない。

ES2015の配列のパラメータハンドリングが便利だった

ES2015の分割代入やパラメータハンドリング、便利そうではあるんだけど、他人がそれを使ったコードを読むと一見なにをやっているのか分からなくて(単純に慣れていないだけな気もする)、これまでの惰性もあって多用するのを避けていた。

で、今日、コードを書いていて、多値を配列として扱ってPromiseを解決した場合に、次のPromiseでそれを受け取る時に便利なことに気づいた。こんなかんじ。

someFn().then(([alpha, beta]) => {
  // ...
});

以前までは、results みたいなイマイチな名前の変数で受け、適切な名前の変数に再代入することを行っていた。

someFn().then((results) => {
  const alpha = results[0];
  const beta = results[1];
  // ...
});

Vuex のドキュメントを翻訳した

Vuex は、Redux インスパイアの Vue.js の周辺ライブラリ。各言語の翻訳があるんですが ( http://vuex.vuejs.org/ )、日本語のドキュメントが v0.8 から更新されていなかったので、v1.0.0-rc.2 を対象に @ktsn さんとドキュメントを翻訳し直しました。読みづらいところや誤りがあるかもしれませんが、見つけたら教えてください。

vuex.vuejs.org

Vuex について、今回の翻訳とドキュメントを読みながらサンプルアプリケーションを書いた程度の印象ですが、Redux の影響を受けつつも、Vue.js 本体の状態の変更を追跡する仕組みを活かして(逆に依存しているともいえますが)、より単純で扱いやすくなっているように見受けられます。作者の設計の意図がドキュメントに丁寧、かつ明確に書かれており、興味深く翻訳させていただきました。仮に Vuex を使わないとしても、中規模~大規模のアプリケーションを自身で構築する場合の設計の一つの例として参考になるはずです。

次は、正式版のリリースが近づいている Vue.js 2.0 か、Vuex 2.0 のドキュメントの翻訳に関わることができればと思います。

knex.js: NodeのSQL Query Builder

最近、趣味と仕事両方で使うNodeで動くちょっとしたウェブアプリを書いている。

おそらくRailsの方が素早くできそう、あるいは普段書かないPythonとかGoみたいな言語で書いてみたかったんだけど、仕事で同じ部署の人に使ったり、手を入れてもらうことを考えると、JSを書いてNodeで動かすのがよかろうと判断した。

で、SQL Query Builderが欲しくなって、色々探したら、インターフェイスがPromiseなのと(Streamもある)、開発が活発というところで knex.js というのがよさそうだった。ドキュメント( Knex.js - A SQL Query Builder for Javascript )がしっかり書かれているので、細かい使い方とかは書きません。

github.com

あと、Query Builderに加えて、おそらくRailsインスパイアのMigrations機能があって、これも必要になったら使うと良さそう。 knex.jsと同じ作者の関連プロジェクトに bookshelf.js というORマッパーライブラリがあるが、今つくっているものに対してやりすぎな気がするのでスルー。

Gitのローカルブランチを更新日時順に表示する

この間、GitHubのトレンドのリポジトリを適当に眺めたり、ソースをだらだら読んでいたら、これをみつけた。

github.com

Gitで最近更新があったブランチをおしゃれに表示してくれるやつ。ソースを読んだら、git for-each-ref っていうサブコマンドを使っていた。 こんなかんじで、更新日とブランチ名のペアの最新10件を表示できる。

git for-each-ref  \
  --sort=-committerdate \
  --format="%(committerdate:short),%(refname:short)" \
  "refs/heads" | head -n 10

と、書いてたんだけど、手元のpecoまわりの設定見たら同じようなことをやっていて、多分、昔調べたことあるな...と思った。

npm installのときのプログレスバーを非表示にする

表示が崩れたり(既に修正はされている npm@3のプログレスバーの表示崩れについて - Qiita)、非表示にすると早くなるというissueを見かけたので( https://github.com/npm/npm/issues/11283 )、非表示にするようにした。

プロジェクトレベルで設定をおこなう場合は、プロジェクトの直下の.npmrcに、全体に適当する場合はホームディレクトリの.npmrcprogress=falseという行を追加すればよろしい。

話ずれるんですけど、Progress bar noticeably slows down npm install · Issue #11283 · npm/npm · GitHubJavaScriptのプロファイリングのやりとり、面白そうですね。時間あるときにじっくり読んでみよう。