【リーダブルコード】第四章 美しさ の要約

優れたソースコードは「目に優しい」

見た目が美しいコードの方が読みやすいはずですよね。
改行やインデントがメチャクチャなコードは大変読みにくいです。
この章では見た目的にコードを読みやすくするための三つの要素と原則が紹介されています。

要素

• 余白
• 配置
• 順序

原則

• 一貫性のあるレイアウト
• 似ているコードは似ているように
• 関連するコードをまとめてブロックに

一貫性のあるレイアウト

以下はscaffoldで生成したuser_controller#createを一貫性のないレイアウトにしたものです。

  def create
    @user = User.new(user_params)
    respond_to do |format|
      if @user.save
                format.html { 
                  redirect_to user_url(@user),
                              notice: 
                    "User was successfully created." 
                }
        format.json { render :show,     status: :created, location: @user }
      else
        format.html { render :new, status: :unprocessable_entity }
                  format.json { render        json: @user.errors,       status:                :unprocessable_entity }
      end
    end
  end

んー読みにくい。
このコードを直していきましょう。

まず、一貫性のあるレイアウトにするためにインデントを修正します。

  def create
    @user = User.new(user_params)
    respond_to do |format|
      if @user.save
        format.html {
          redirect_to user_url(@user),
                          notice:
                "User was successfully created."
          }
        format.json { render :show,     status: :created, location: @user }
      else
        format.html { render :new, status: :unprocessable_entity }
        format.json { render        json: @user.errors,       status:                :unprocessable_entity }
      end
    end
  end

formatの位置が揃ったことで見やすくなりました。
次にスペースの位置を揃えましょう。

  def create
    @user = User.new(user_params)
    respond_to do |format|
      if @user.save
        format.html {
          redirect_to user_url(@user),
                          notice:
                "User was successfully created."
          }
        format.json { render :show, status: :created, location: @user }
      else
        format.html { render :new, status: :unprocessable_entity }
        format.json { render json: @user.errors, status: :unprocessable_entity }
      end
    end
  end

render以下の位置が揃ったことで見やすくなりました。
ただ、if文の中にある一つ目のformat.htmlの改行が不適切で、似ているコードは似ているようにの原則が守られていないので修正しましょう。

  def create
    @user = User.new(user_params)
    respond_to do |format|
      if @user.save
        format.html { redirect_to user_url(@user), notice: "User was successfully created." }
        format.json { render :show, status: :created, location: @user }
      else
        format.html { render :new, status: :unprocessable_entity }
        format.json { render json: @user.errors, status: :unprocessable_entity }
      end
    end
  end

これで似ているコードが似ている形になりましたね。
最後に意味のある段落分けをしましょう。

  def create
    @user = User.new(user_params)

    respond_to do |format|
      if @user.save
        format.html { redirect_to user_url(@user), notice: "User was successfully created." }
        format.json { render :show, status: :created, location: @user }
      else
        format.html { render :new, status: :unprocessable_entity }
        format.json { render json: @user.errors, status: :unprocessable_entity }
      end
    end
  end

変数に値を入れているところと、respondを段落分けすることで処理がみやすくなりました💪

他にもコードを見やすくする方法として

• 宣言をブロックにまとめる
• 繰り返し使ってる処理をメソッドにする

などがありました。

最後に重要な考えとして、プロジェクトにアサインしているのであれば、個人の好みよりプロジェクトの規約を大事にすべき（一貫性）というものがありました 👀
仮に規約が一般的でないものだとしても、一貫性が大事ということですね 💪