JavaScriptのコードはコールバックが多かったり、処理した結果を関数で受け取ったりするので分かりづらいと感じるようです。もっと構造を分かりやすく分解して欲しいと思う方もいるでしょう。 そこで使ってみたいのがMeshです。JavaScriptのコードを表計算の形で表現してくれる…何を言っているかよく分からないかも知れませんが、そんなソフトウェアです。

Meshの使い方

メイン画面です。編集するのはコードではなく、左側の表です。

numbersという変数を記述しました。デフォルト値はnullです。

配列にするとAPPENDが表示されます。

データを追加すると配列の初期化に追加されます。

さらに別な変数を追加しました。

test2は別な配列を2倍にしたものです。値がきちんと反映されています。

値をクリックすると、どの部分なのかがハイライトされます。

Meshの表示が分かりやすいかどうかは不明ですが、表計算のような形式からJavaScriptのコードに変換しているのは分かります。それによってどの部分で処理されたものかも補足できるようになっています。技術的に面白いソフトウェアです。

MeshはJavaScript製のオープンソース・ソフトウェア(Apache Licnese 2.0)です。

chrispsn/mesh: Visualise data and edit JavaScript code using a spreadsheet interface.