ITエンジニア/デザイナ向けにオープンソースを毎日紹介

コードのコピペは絶対に悪であるという訳ではありませんが、そこにはメソッド、関数としてまとめられるかも知れないというリファクタリングの余地があります。なのでリファクタリングを行う際には一度既存のコードについて重複した部分がないかチェックしてみると良いでしょう。

クライアントサイドのJavaScriptやnodeで作ったアプリケーションであればjsinspectを使ってみましょう。

jsinspectの使い方

インストールはnpmで行えます。

$ npm install -g jsinspect

インストールが終わったらソースコードのあるディレクトリを指定するだけです。

$ jsinspect ./

Match - 2 instances
./app.js:12,18
./app.js:29,35

- ./app.js:12,18
+ ./app.js:29,35
+  return this.chatLogic.postData(params).done(function(message) {
+    return me.view.prepend(".messages", 'messages_template', {
+      messages: [message]
-  return this.chatLogic.getData().done(function(messages) {
-    return me.view.append(".messages", 'messages_template', {
-      messages: messages
     });
   }).fail(function(data) {
     return console.log('error', data);
   });

このように重複していると思われる部分がリストアップされます。実際に改善できるかどうかは分かりませんが、確かに似ていますね。全く同じ部分だけでなく、似た部分も抽出してくれるのが肝と言えそうです。

このようにカラーリング表示されます。
このようにカラーリング表示されます。

オプションは以下のようになります。

$ jsinspect --help

  Usage: jsinspect [options] <paths ...>

  Duplicate code and structure detection for JavaScript.
  Identifier matching is disabled by default. Example use:
  jsinspect -t 30 -i --ignore "Test.js" ./path/to/src


  Options:

    -h, --help                output usage information
    -V, --version             output the version number
    -t, --threshold <number>  minimum size of nodes (default: 15)
    -i, --identifiers         match identifiers
    -D, --no-diff             disable 2-way diffs
    -C, --no-color            disable colors
    --ignore <pattern>        ignore paths matching a regex

会社内で作っているプロジェクトで実行したりすると面白い結果が得られるかも知れませんね。

jsinspectはnode/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。

danielstjules/jsinspect

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2