#10 Refactoring User Name Part 1

En este episodio veremos refactoreo. Refactorear es mejorar el diseño del código sin cambiar su funcionalidad. Esto puede hacerse para eliminar duplicación o mejorar la lectura y mantenimiento del código.

En esta aplicación tenemos un listado de usuarios. Al hacer click en un usuario se nos muestra sus perfiles. Tengamos en cuenta que algunos usuarios tienen una letra inicial en su segundo nombre, mientras que otro no.

Las vistas index y show en un navegador.

Veamos el código de la vista. Primero, el código de index:

<h1>Users</h1>  
<ul>  
<% for user in @users %>  
<li>  
  <a href="<%= user_path(user) %>">  
    <%= user.first_name %>  
    <%= "#{user.middle_initial}." unless user.middle_initial.nil? %>  
    <%= user.last_name %>  
  </a>  
</li>  
<% end %>  
</ul>

El código de la vista index

El código de arriba obtiene todos los usuarios y hace un bucle sobre todos sus datos. Las tres líneas dentro del elemento <a>, muestran el nombre de usuario. Ahora, veamos la página del perfil.

<h1>Profile</h1>  
<p>  
  Name:  
  <%= @user.first_name %>  
  <%= "#{@user.middle_initial}." unless @user.middle_initial.nil? %>  
  <%= @user.last_name %>  
</p>  
<%= link_to 'Users List', users_path %>

El código de la vista de la acción show.

La página del perfil tiene las mismas tres líneas de código para mostrar el nombre de usuario como en la página index. Esto, obviamente, es una duplicación y un buen candidato a ser refactoreado. El código para mostrar el nombre de usuario separa el nombre en tres partes. Esto es para que la letra inicial del segundo nombre tenga un punto (.) detrás, a menos que el usuario no tenga letra inicial para su segundo nombre.

¿ Cómo empezamos a refactorear ?

Una forma de refactorear este código sería moverlo a un método helper, pero no hay HTML en el código, solamente el nombre de usuario que está relacionado al modelo User. El lugar ideal para colocarlo sería en el modelo User. Entonces, vamos a crear un método en el modelo User llamado full_name. Vamos a empezar colocando el código que se repite de las vistas index y show. Luego, colocaremos las tres partes del nombre en una variable local y devolveremos la variable local.

class User < ActiveRecord::Base  
  def full_name  
    name = first_name + ' '  
    name += "#{middle_initial}. " unless middle_initial.nil?  
    name += last_name   
    name  
  end  
end

El modelo User despues de agregar el método full_name

Al mover el código al modelo User, la variable @user no puede ser referenciada. Pero, como estamos haciendo llamadas a métodos en el modelo User, podemos eliminarla.

¿Funciona nuestro refactoreo?

Ahora que ya tenemos nuestro método full_name podemos reemplazar el código en nuestras vistas index y show. Veamos a la parte relevante de la vista index.

<a href="<%= user_path(user) %>">  
  <%= user.full_name %>  
</a>

La vista index con el método full_name.

Hay otra forma en la que podemos mejorar el código de arriba. Como teníamos un código un tanto complicado para generar el nombre de usuario, tuvimos que usar un tag HTML <a>, en vez de link_to. Ahora podremos utilizar link_to y simplificar, aún mas, el código de la vista.

<%= link_to user.full_name, user_path(user) %>

La vista index con link_to.

El código del modelo User y sus vistas, han mejorado mucho desde que empezamos. Hemos eliminado la duplicación y movimos el código con el nombre del usuario, que le pertenece al modelo, dentro del modelo User. Pero aún podemos hacer mejoras, y veremos como el código puede mejorar más en el siguiente episodio.

El código después de refactorear.

class User < ActiveRecord::Base  
  def full_name  
    name = first_name + ' '  
      name += "#{middle_initial}. " unless middle_initial.nil?  
      name += last_name   
      name  
  end  
end

El modelo User luego de refactorear.

<h1>Users</h1>  
<ul>  
<% for user in @users %>  
    <li><%= link_to user.full_name %></li>  
<% end %>  
</ul>

La vista index luego de refactorear.

<h1>Profile</h1>  
<p>Name: <%= @user.full_name %></p>  
<%= link_to 'Users List', users_path %>

La vista show luego de refactorear.