Refactorisation de code avec GitHub Copilot

Exploitez l’intelligence artificielle de Copilot pour vous aider à refactoriser votre code rapidement et efficacement.

Dans cet article

Présentation

La refactorisation de code consiste à restructurer du code existant sans en modifier le comportement. Les avantages de la refactorisation incluent l’amélioration de la lisibilité du code, la réduction de sa complexité, la facilitation de sa maintenance et la possibilité d’ajouter plus facilement de nouvelles fonctionnalités.

Cet article vous donne des idées pour utiliser Copilot afin de refactoriser du code dans votre IDE.

Remarque

Des exemples de réponses sont inclus dans cet article. Conversation GitHub Copilot peut vous fournir des réponses différentes de celles présentées ici.

Comprendre le code

Avant de modifier du code existant, vous devez vous assurer de comprendre son objectif et son fonctionnement actuel. Copilot peut vous aider.

  1. Sélectionnez le code pertinent dans l’éditeur de votre IDE.

  2. Ouvrez la conversation inline :

    • Dans VS Code : appuyez sur Commande+i (Mac) ou Ctrl+i (Windows/Linux).
    • Dans Visual Studio : appuyez sur Alt+/.
    • Dans JetBrains IDEs : appuyez sur Ctrl+Maj+i (Mac) ou Ctrl+Maj+g (Windows/Linux).

  3. Dans la zone de saisie du chat inline, tapez une barre oblique (/).

  4. Dans la liste déroulante, sélectionnez /explain et appuyez sur Entrée.

  5. Si l’explication fournie par Copilot dépasse quelques lignes, cliquez sur Afficher dans le Chat pour la lire plus facilement.

Optimisation d’un code inefficace

Copilot peut vous aider à optimiser du code, par exemple, pour l’exécuter plus rapidement.

Exemple de code

Dans les deux sections ci-dessous, nous utiliserons l’exemple de script bash suivant pour montrer comment optimiser un code inefficace :

#!/bin/bash

# Find all .txt files and count lines in each
for file in $(find . -type f -name "*.txt"); do
    wc -l "$file"
done

Utiliser le panneau Discussion avec Copilot

Copilot peut vous dire si un code, comme l’exemple de script bash, peut être optimisé.

  1. Sélectionnez soit la boucle for, soit tout le contenu du fichier.

  2. Ouvrez Discussion avec Copilot en cliquant sur l’icône de chat dans la barre d’activité ou en utilisant le raccourci clavier :

    •           **VS Code et Visual Studio :**<kbd>Control</kbd>+<kbd>Command</kbd>+<kbd>i</kbd> (Mac) / <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>i</kbd> (Windows/Linux)

    •           **JetBrains :**<kbd>Control</kbd>+<kbd>Shift</kbd>+<kbd>c</kbd>

  3. Dans la zone de saisie au bas du panneau de chat, tapez : Can this script be improved?

    Copilot répond par une suggestion rendant le code plus efficace.

  4. Pour appliquer la modification suggérée :

    •           **Dans VS Code et JetBrains :** survolez la suggestion dans le panneau de chat et cliquez sur l’icône **Insérer à l'emplacement du curseur**.

      Capture d’écran de l’icône « Insert at cursor » dans le panneau Discussion avec Copilot.

    •           **Dans Visual Studio :** cliquez sur **Aperçu** puis, dans la vue de comparaison, cliquez sur **Accepter**.

Utiliser le chat inline de Copilot

Autre possibilité : si vous savez déjà que le code existant, comme l’exemple de script bash, est inefficace :

  1. Sélectionnez soit la boucle for, soit tout le contenu du fichier.

  2. Ouvrez la conversation inline :

    • Dans VS Code : appuyez sur Commande+i (Mac) ou Ctrl+i (Windows/Linux).
    • Dans Visual Studio : appuyez sur Alt+/.
    • Dans JetBrains IDEs : appuyez sur Ctrl+Maj+i (Mac) ou Ctrl+Maj+g (Windows/Linux).

  3. Tapez optimize, puis appuyez sur Entrée.

    Copilot propose une version révisée du code. Voici un exemple :

    find . -type f -name "*.txt" -exec wc -l {} +

    Elle est plus efficace que le code original présenté plus haut dans cet article, car l’utilisation de -exec ... + permet à find de transmettre plusieurs fichiers à wc en une seule fois, plutôt que d’appeler wc une fois pour chaque fichier *.txt trouvé.

  4. Évaluez les suggestions Copilot et, si vous acceptez la modification :

    • Dans VS Code et Visual Studio : cliquez sur Accepter.
    • Dans JetBrains : cliquez sur l’icône Aperçu (flèches doubles), puis sur l’icône Appliquer tous les différences (crochets doubles).

Comme avec toutes les suggestions Copilot, vous devez toujours vérifier que le code révisé s’exécute sans erreurs et produit le résultat correct.

Nettoyage de code répété

Éviter les répétitions facilite la révision et le débogage du code. Par exemple, si un même calcul est effectué à plusieurs endroits dans un fichier, vous pouvez déplacer ce calcul dans une fonction.

Dans l’exemple JavaScript très simple suivant, le même calcul (prix de l’article multiplié par le nombre d’articles vendus) est réalisé à deux endroits.

let totalSales = 0;

let applePrice = 3;
let applesSold = 100;
totalSales += applePrice * applesSold;

let orangePrice = 5;
let orangesSold = 50;
totalSales += orangePrice * orangesSold;

console.log(`Total: ${totalSales}`);

Vous pouvez demander à Copilot de déplacer ce calcul répété dans une fonction.

  1. Sélectionnez tout le contenu du fichier.

  2. Ouvrez la conversation inline :

    • Dans VS Code : appuyez sur Commande+i (Mac) ou Ctrl+i (Windows/Linux).
    • Dans Visual Studio : appuyez sur Alt+/.
    • Dans JetBrains IDEs : appuyez sur Ctrl+Maj+i (Mac) ou Ctrl+Maj+g (Windows/Linux).

  3. Tapez : move repeated calculations into functions et appuyez sur Entrée.

    Copilot propose une version révisée du code. Voici un exemple :

    function calculateSales(price, quantity) {
  return price * quantity;
}

let totalSales = 0;

let applePrice = 3;
let applesSold = 100;
totalSales += calculateSales(applePrice, applesSold);

let orangePrice = 5;
let orangesSold = 50;
totalSales += calculateSales(orangePrice, orangesSold);

console.log(`Total: ${totalSales}`);

  4. Évaluez les suggestions Copilot et, si vous acceptez la modification :

    • Dans VS Code et Visual Studio : cliquez sur Accepter.
    • Dans JetBrains : cliquez sur l’icône Aperçu (flèches doubles), puis sur l’icône Appliquer tous les différences (crochets doubles).

Comme avec toutes les suggestions Copilot, vous devez toujours vérifier que le code révisé s’exécute sans erreurs et produit le résultat correct.

Rendre le code plus concis

Si un code est inutilement verbeux, il peut devenir difficile à lire et à maintenir. Copilot peut suggérer une version plus concise du code sélectionné.

Dans l’exemple suivant, ce code Python affiche l’aire d’un rectangle et d’un cercle, mais il pourrait être écrit de manière plus concise :

def calculate_area_of_rectangle(length, width):
    area = length * width
    return area

def calculate_area_of_circle(radius):
    import math
    area = math.pi * (radius ** 2)
    return area

length_of_rectangle = 10
width_of_rectangle = 5
area_of_rectangle = calculate_area_of_rectangle(length_of_rectangle, width_of_rectangle)
print(f"Area of rectangle: {area_of_rectangle}")

radius_of_circle = 7
area_of_circle = calculate_area_of_circle(radius_of_circle)
print(f"Area of circle: {area_of_circle}")

  1. Sélectionnez tout le contenu du fichier.

  2. Ouvrez la conversation inline :

    • Dans VS Code : appuyez sur Commande+i (Mac) ou Ctrl+i (Windows/Linux).
    • Dans Visual Studio : appuyez sur Alt+/.
    • Dans JetBrains IDEs : appuyez sur Ctrl+Maj+i (Mac) ou Ctrl+Maj+g (Windows/Linux).

  3. Tapez : make this more concise et appuyez sur Entrée.

    Copilot propose une version révisée du code. Voici un exemple :

    import math

def calculate_area_of_rectangle(length, width):
  return length * width

def calculate_area_of_circle(radius):
  return math.pi * (radius ** 2)

print(f"Area of rectangle: {calculate_area_of_rectangle(10, 5)}")
print(f"Area of circle: {calculate_area_of_circle(7)}")

  4. Évaluez les suggestions Copilot et, si vous acceptez la modification :

    • Dans VS Code et Visual Studio : cliquez sur Accepter.
    • Dans JetBrains : cliquez sur l’icône Aperçu (flèches doubles), puis sur l’icône Appliquer tous les différences (crochets doubles).

Comme avec toutes les suggestions Copilot, vous devez toujours vérifier que le code révisé s’exécute sans erreurs et produit le résultat correct.

Scinder des unités de code complexes

Les méthodes ou fonctions volumineuses effectuant plusieurs opérations offrent généralement moins de possibilités de réutilisation que des fonctions plus petites, centrées sur une mission précise. Elles peuvent également être plus difficiles à comprendre et à déboguer.

Copilot peut vous aider à diviser des blocs de code complexes en unités plus petites, mieux adaptées à la réutilisation.

Le code Python suivant est un exemple très simple, mais illustre le principe de division d’une fonction en deux fonctions effectuant des opérations particulières.

import pandas as pd
from pandas.io.formats.style import Styler

def process_data(item, price):
    # Cleanse data
    item = item.strip()  # Strip whitespace from item
    price = price.strip()  # Strip whitespace from price
    price = float(price) # Convert price to a float
    # More cleansing operations here

    # Create and print a DataFrame
    data = {'Item': [item], 'Price': [price]}
    df = pd.DataFrame(data)
    print(df.to_string(index=False))

# Example usage
item = "   Apple "
price = " 1.25"
process_data(item, price)

Pour diviser la fonction process_data :

  1. Placez le curseur sur le nom de la fonction.

  2. Ouvrez la conversation inline :

    • Dans VS Code : appuyez sur Commande+i (Mac) ou Ctrl+i (Windows/Linux).
    • Dans Visual Studio : appuyez sur Alt+/.
    • Dans JetBrains IDEs : appuyez sur Ctrl+Maj+i (Mac) ou Ctrl+Maj+g (Windows/Linux).

  3. Tapez : split into 2 separate functions: one for cleansing data, the other for printing et appuyez sur Entrée.

    Copilot propose une version révisée du code. Voici un exemple :

    def cleanse_data(item, price):
  # Cleanse data
  item = item.strip()  # Strip whitespace from item
  price = price.strip()  # Strip whitespace from price
  price = float(price)  # Convert price to a float
  return item, price

def print_data(item, price):
  # Create and print a DataFrame
  data = {'Item': [item], 'Price': [price]}
  df = pd.DataFrame(data)
  print(df.to_string(index=False))

def process_data(item, price):
  item, price = cleanse_data(item, price)
  print_data(item, price)

    Remarque

    La suggestion présentée ci-dessus remplace la fonction existante par trois fonctions. La troisième fonction appelle simplement les deux autres, ce qui permet de conserver la compatibilité avec le code existant appelant la fonction process_data.

  4. Évaluez les suggestions Copilot et, si vous acceptez la modification :

    • Dans VS Code et Visual Studio : cliquez sur Accepter.
    • Dans JetBrains : cliquez sur l’icône Aperçu (flèches doubles), puis sur l’icône Appliquer tous les différences (crochets doubles).

Comme avec toutes les suggestions Copilot, vous devez toujours vérifier que le code révisé s’exécute sans erreurs et produit le résultat correct.

Réécrire du code conditionnel pour une meilleure lisibilité

Il existe souvent plusieurs façons d’écrire du code qui s’exécute ou non selon certaines conditions. Certaines structures conditionnelles conviennent mieux que d’autres à certains cas d’usage, et choisir une structure alternative peut parfois améliorer la lisibilité du code.

Cette méthode Java utilise une série d’instructions if et else if pour déterminer quelle opération effectuer :

public String getSound(String animal) {
  if (animal == null) {
      System.out.println("Oops! A null animal?");
  } else if (animal.equalsIgnoreCase("Dog")) {
      return "Bark";
  } else if ( animal.equalsIgnoreCase("Cat")) {
      return "Meow";
  } else if ( animal.equalsIgnoreCase("Bird")) {
      return "Tweet";
  }
  return "Unknown";
}

Une instruction switch pourrait mieux convenir pour appliquer la même logique.

  1. Placez le curseur dans le nom de la méthode.

  2. Ouvrez la conversation inline :

    • Dans VS Code : appuyez sur Commande+i (Mac) ou Ctrl+i (Windows/Linux).
    • Dans Visual Studio : appuyez sur Alt+/.
    • Dans JetBrains IDEs : appuyez sur Ctrl+Maj+i (Mac) ou Ctrl+Maj+g (Windows/Linux).

  3. Entrez : rewrite the condition to use a switch and use Java 21 syntax with null case, but also add documentation and provide a better function name.

    Cela montre comment un seul prompt peut demander à Copilot d’effectuer plusieurs modifications.

  4. Appuyez sur Entrée.

    Copilot propose une version révisée du code. Voici un exemple :

    /**
 * Retrieves the sound made by a given animal.
 *
 * @param animal The name of the animal.
 * @return The sound made by the animal, or "Unknown" if the animal is not recognized.
 */
public String getAnimalSound(String animal) {
    return switch (animal) {
        case null -> {
            System.out.println("Oops! A null animal?");
            yield "Unknown";
        }
        case String a when a.equalsIgnoreCase("Dog") -> "Bark";
        case String a when a.equalsIgnoreCase("Cat") -> "Meow";
        case String a when a.equalsIgnoreCase("Bird") -> "Tweet";
        default -> "Unknown";
    };
}

  5. Évaluez les suggestions Copilot et, si vous acceptez la modification :

    • Dans VS Code et Visual Studio : cliquez sur Accepter.
    • Dans JetBrains : cliquez sur l’icône Aperçu (flèches doubles), puis sur l’icône Appliquer tous les différences (crochets doubles).

Comme avec toutes les suggestions Copilot, vous devez toujours vérifier que le code révisé s’exécute sans erreurs et produit le résultat correct.

Reformater du code selon une structure différente

Supposons que vous ayez cette fonction en JavaScript :

function listRepos(o, p) {
 return fetch(`https://api.github.com/orgs/${o}/repos?per_page=${parseInt(p)}`)
   .then((response) => response.json())
   .then( (data) => data);
}

Si vos normes de codage exigent l’utilisation de la notation en flèche pour les fonctions, ainsi que des noms de paramètres descriptifs, vous pouvez utiliser Copilot pour vous aider à effectuer ces modifications.

  1. Placez le curseur sur le nom de la fonction.

  2. Ouvrez la conversation inline :

    • Dans VS Code : appuyez sur Commande+i (Mac) ou Ctrl+i (Windows/Linux).
    • Dans Visual Studio : appuyez sur Alt+/.
    • Dans JetBrains IDEs : appuyez sur Ctrl+Maj+i (Mac) ou Ctrl+Maj+g (Windows/Linux).

  3. Tapez : use arrow notation and better parameter names et appuyez sur Entrée.

    Copilot propose une version révisée du code. Voici un exemple :

    const listRepos = (org, perPage) => {
  return fetch(`https://api.github.com/orgs/${org}/repos?per_page=${parseInt(perPage)}`)
    .then(response => response.json())
    .then(data => data);
};

Amélioration du nom d’un symbole

Remarque

  • VS Code et Visual Studio uniquement.
  • La prise en charge de cette fonctionnalité dépend de l’extension de langage installée dans votre IDE pour le langage utilisé. Toutes les extensions de langage ne prennent pas en charge cette fonctionnalité.

Des noms bien choisis peuvent rendre le code plus facile à maintenir. Copilot dans VS Code et Visual Studio peut suggérer d’autres noms pour des symboles tels que des variables ou des fonctions.

  1. Placez le curseur dans le nom du symbole.

  2. Appuyez sur F2.

  3.           **Visual Studio uniquement :** appuyez sur <kbd>Ctrl</kbd>+<kbd>Espace</kbd>.

    Copilot propose des noms alternatifs.

    Capture d’écran d’une liste déroulante dans VS Code proposant des alternatives pour un nom de symbole.

  4. Dans la liste déroulante, sélectionnez l’un des noms proposés.

    Le nom est modifié dans tout le projet.