web-dev-qa-db-ja.com

コンパクトなコードまたはスペースの多いコードを記述する必要がありますか？

コードをどのようにレイアウトするかについて、まったく異なる考え方を持つ2人の友人がいます。

最初のコードでは、インデントを適切に設定し、多くのスペースを使用する必要があるとしていますと、コードの階層とセマンティクスをすぐに理解できるように整理するために、変数に慎重に名前を付けます。

これが彼のコードの例です。

var Stack = function () {

    var pair = function ( first ) {
        return function ( second ) {
            return function ( dispatcher ) {
                return dispatcher ( first ) ( second );
            };
        };
    };

    var getFirst = function ( pair ) {
        return pair ( function ( x ) {
            return function ( y ) {
                return x;
            };
        } );
    };

    var getSecond = function ( pair ) {
        return pair ( function ( x ) {
            return function ( y ) {
                return y;
            };
        } );
    };

    var emptyStack = function () {
        return function () {
            return null;
        }
    };

    var stack = emptyStack ();

    var self = {
        Push: function ( item ) {
            stack = pair ( item ) ( stack ); 
            return self;
        },
        pop: function () {
            var top = getFirst ( stack );
            stack = getSecond ( stack ) || emptyStack ();
            return top;
        },
        top: function () {
            return getFirst ( stack );
        }
    };

    return self;
};

2番目は、コードをよりコンパクトな方法で記述した方がよいことを示していますこれにより、画像のより大きな部分を一度に確認し、プログラムの一部がどのようになっているかをすぐに認識することができます。別のものに影響を与えます。

これは彼のスタイルで書かれた同じプログラムです：

var Stack=function(){
var pair=function(x){return function(y){return function(f){return f(x)(y)}}};
var fst=function(p){return p(function(x){return function(y){return x}})};
var snd=function(p){return p(function(x){return function(y){return y}})};
var empt=function(){return function(){return null}};var stk=empt();
var slf={Push:function(val){stk=pair(val)(stk);return slf},
pop:function(){var top=fst(stk);stk=snd(stk)||empt();return top},
top:function(){return fst(stk)}};return slf}

私は個人的には最初の方法でコードを書くことを好みますが、実際には2番目の方法をあまり試していなかったので、慣れていないかもしれません。

ほとんどのプロのWebサイトのJavascriptコードを見ると、通常2番目のスタイルを使用しているため、何か問題があることに気づきました。

主観的な文体の好み以外に、どちらか一方を優先する理由はありますか？

coding-stylereadabilitycode-formattingindentationwhitespace
15
Peter Olson

より大きなプログラムに対応できるため、最初のアプローチを使用する必要があります。

「すべてがすべてにどのように影響するかを理解する必要がある」という考え方は、ソフトウェア開発に有害です。関数/オブジェクトを分離して、別の離れた/無関係な関数を壊さずに1つのものを変更できるようにします。

コンパクトなコーディングスタイルを使用している場合でも、画面に一度に収まらないほど多くのコードが含まれることになります。

より良い解決策（Clean Code by Robert Martinによる）は、最初にパブリックな「高レベル」関数をリストし、各関数を1つの詳細レベルに留めることです。

17
Aaron Kurtzhals

私は通常、＃1と同様にインデントされたコードを記述しますが、空白行は少なくなっています。インデントにより、ブラケットの問題を簡単に検出できます。これは、それ自体の行の各割り当てと組み合わせて、物事を読みやすくします。タブ補完により、余計な入力をしなくても、より長い変数名を使用できます。

はい、長くなりますが、長いコードを書くことに問題はありません。読みやすくするためにこの回答で段落を使用しているのと同じように、コードで同じことをしてみませんか？通訳は違いを知らない*ので、利益を得る唯一の人はあなたです。

Emacsには、毎日使用するVHDLプラグインがあり、キーボードショートカットを介してコードを自動的に美化します。これにより、書式設定に時間を費やすのではなく、コーディングに集中できます。

*言語によって異なります。 Pythonなどの一部の言語では、構文の一部としてインデントが使用されています。この場合、インタプリタdoesは違いを認識しています。

2
user81965

ほとんどのIDEでは、最初のサンプルを8行（または1行）の小さな行に折りたたむことができるため、全体像を確認できます。逆に、2番目のサンプルを最初のサンプルのように簡単に作成することはできません。

最初のサンプルは、特に初心者の方が理解しやすいです。実行されたアクションの階層とシーケンスを明らかにします。それに加えて、IMOの初心者は2番目のサンプルをすぐに把握するのがかなり難しくなります。

だから、多かれ少なかれ経験豊富な専門家の環境で働いているなら、私は2番目のサンプルを好むでしょう-そのスタイルに慣れているなら、一目でアイデア全体を把握できます。ただし、実際には、経験豊富な開発者のみで構成される開発環境は（もしあれば）非常に少ないため、最初のサンプルの方が適しています。

追伸これらすべてのスペースと新しい行を手動で記述したくない場合は、自動化ツールを使用できます。

2
superM

私はsuperMが言ったことに同意します。私の2セント：

私はコードをはるかに簡単に維持できるので、（極端ではない）最初のものを好みます。自分のコードを6か月前から変更しなければならない場合でも、2番目のスタイルは最初のスタイルほど速く理解できません。

JavaScriptに表示されるものはおそらくより人間的な方法で記述されていて、コメントも含まれていますが、一部のセミコンパイラーはいくつかの機械的な変更（変数名をusersFacebookIDからaに減らすなど）を行いましたすべてのコメントを削除します）。これにより、ユーザーに送信されるデータの量が減り、これがWebアプリの主要なボトルネックになるため、サイトの読み込みが速くなるようです。 （そしてエンドユーザーはとにかくコードスタイルを気にしません）。

1
Ramzi Kahil

IDEが言語の解析と折りたたみをサポートしていない場合は、より簡潔な形式が適切ですが、全体としてエラーを拾うのは難しくなります。情報密度は高すぎると簡単にエラーを乗り越えることができます。それ以外に、1つの関数で複数の呼び出しを行う必要がある場合は、行の長さが非常に長くなり、横にスクロールする必要があります。 、これは、ほとんどのIDEが行うように設計されています）コンパイルされる代わりに解釈されるスクリプト言語を使用している場合、出荷する前にミニファイアを使用する必要があります。ミニファイアの使用は、帯域幅の理由でJSを使用する場合のWeb開発会社での一般的な慣行。インタープリター型言語では、空白はノイズです。コンパイラーは通常、ソースコードをトークン化するときに過剰な空白を削除し、処理後に有用な情報のみを残します。コンパイラは一度ノイズに対処してください。通訳は毎回その騒音に対処しなければなりません。 （最近の問題を緩和するために、ほとんどのキャッシュには何らかの種類があります。）

最終的には、ソースの編集に使用するプラットフォームと、コードを使用する言語/環境に依存しますが、オプション1に投票します。

1
Onno

友達に同意する1

コンパイラの観点からは問題ありません...そしてオプション2では、ギガバイトのハードドライブに数バイトのファイルサイズしか節約できません

人間の観点から見ると、自分が書いたものを知っているので、今日どのように使用してもかまいません。

しかし、1日、1週間、1か月、または1年以内に戻ってきた場合、または他の誰かが戻ってきた場合、オプション2は読みにくく、理解しにくくなります。

1
Andrew

極端なことはしないでください。むしろ書きたい

var Stack=function(){
    var pair=function(x){return function(y){return function(f){return f(x)(y)}}};
    var fst=function(p){return p(function(x){return function(y){return x}})};
    var snd=function(p){return p(function(x){return function(y){return y}})};
    var empt=function(){return function(){return null}};
    var stk=empt();
    var r={
        Push:function(val){stk=pair(val)(stk); return r},
        pop:function(){var top=fst(stk); stk=snd(stk)||empt(); return top},
        top:function(){return fst(stk)}
        };
    return r}

コンパクトですand読み取り可能です。

0
amara