Code Completions

Intermedio
Visual Studio Code
Visual Studio Code
Actualizado: 18/04/2026

Code Completions

Las code completions de GitHub Copilot representan la forma más natural e inmediata de interactuar con la inteligencia artificial mientras programas. A diferencia de otros sistemas de autocompletado tradicionales, Copilot analiza el contexto completo de tu código y genera sugerencias inteligentes que van desde completar una línea hasta proponer bloques enteros de código.

Visualización de sugerencias

Cuando Copilot tiene una sugerencia para tu código, aparece como ghost text en color gris claro directamente en el editor. Este texto fantasma se posiciona donde continuarías escribiendo, creando una experiencia visual fluida que no interrumpe tu flujo de trabajo.

function calcularDescuento(precio, porcentaje) {
    // Copilot mostrará en gris: return precio * (1 - porcentaje / 100);
}

El ghost text se actualiza dinámicamente mientras escribes, adaptándose al contexto que vas creando. Si comienzas a escribir algo diferente a lo sugerido, la sugerencia se ajusta o desaparece automáticamente.

Aceptación de sugerencias

Para aceptar una sugerencia completa, simplemente presiona la tecla Tab. Esta acción insertará todo el texto sugerido en tu editor:

<!-- Escribes: <div class="container" -->
<!-- Copilot sugiere: ><h1>Título</h1><p>Contenido</p></div> -->
<!-- Presionas Tab y se completa toda la sugerencia -->
<div class="container"><h1>Título</h1><p>Contenido</p></div>

Si prefieres aceptar la sugerencia palabra por palabra, utiliza Ctrl + → (flecha derecha). Esta técnica es especialmente útil cuando la sugerencia es larga pero solo necesitas una parte:

/* Escribes: .button { */
/* Copilot sugiere: background-color: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 4px; */
/* Usando Ctrl + → puedes aceptar solo: background-color: #007bff; */

Navegación entre múltiples sugerencias

Copilot frecuentemente genera múltiples alternativas para el mismo contexto. Para navegar entre estas opciones, utiliza:

  • Alt + ] para ver la siguiente sugerencia
  • Alt + [ para ver la sugerencia anterior
def procesar_datos(lista):
    # Sugerencia 1: return [x * 2 for x in lista]
    # Sugerencia 2: return list(map(lambda x: x * 2, lista))
    # Sugerencia 3: resultado = []
    #               for item in lista:
    #                   resultado.append(item * 2)
    #               return resultado

Esta funcionalidad te permite explorar diferentes enfoques para resolver el mismo problema, desde soluciones concisas hasta implementaciones más explícitas.

Rechazo de sugerencias

Para rechazar una sugerencia, tienes dos opciones principales:

  • Presiona Esc para descartar explícitamente la sugerencia actual
  • Continúa escribiendo tu propio código, lo que automáticamente descarta la sugerencia
function saludar(nombre) {
    // Copilot sugiere: return "Hola, " + nombre;
    // Si escribes "console" la sugerencia desaparece
    console.log(`Hola, ${nombre}`);
}

Sugerencias contextuales mediante comentarios

Los comentarios descriptivos actúan como guías poderosas para obtener sugerencias más precisas. Copilot interpreta estos comentarios como especificaciones de lo que deseas implementar:

// Función que valida si un email tiene formato correcto
function validarEmail(email) {
    // Copilot generará una expresión regular para validación de email
}

// Crear un array con los primeros 10 números pares
const numerosPares = // Copilot sugerirá: Array.from({length: 10}, (_, i) => (i + 1) * 2)

Escribe comentarios específicos antes de implementar funcionalidad compleja. Cuanto más detallado sea el comentario, más precisa será la sugerencia:

# Función que lee un archivo CSV y devuelve un diccionario
# donde las claves son los nombres de las columnas
def leer_csv_como_diccionario(ruta_archivo):
    # Copilot generará código usando csv.DictReader

Soporte para múltiples lenguajes

Copilot ofrece sugerencias inteligentes para una amplia variedad de lenguajes, adaptándose a las convenciones específicas de cada uno:

HTML estructural:

<!-- Formulario de contacto -->
<form class="contact-form">
    <!-- Copilot completará con campos típicos de contacto -->
</form>

CSS con mejores prácticas:

.card {
    /* Copilot sugerirá propiedades modernas como flexbox, grid, etc. */
}

JavaScript funcional:

const usuarios = [
    {nombre: "Ana", edad: 25},
    {nombre: "Carlos", edad: 30}
];

// Filtrar usuarios mayores de edad
const mayoresDeEdad = usuarios.filter(
    // Copilot completará: usuario => usuario.edad >= 18
);

Optimización de sugerencias

Para obtener las mejores sugerencias posibles, sigue estas prácticas:

  • Usa nombres descriptivos para variables y funciones
  • Escribe comentarios claros sobre la funcionalidad deseada
  • Mantén un contexto coherente en tu archivo
  • Estructura tu código de forma lógica y consistente
// ❌ Contexto poco claro
function f(x) {
    // Sugerencias genéricas
}

// ✅ Contexto claro
function calcularPrecioConDescuento(precioOriginal, porcentajeDescuento) {
    // Copilot generará cálculos precisos para descuentos
}

Las code completions se integran naturalmente en tu flujo de desarrollo, actuando como un compañero de programación que anticipa tus necesidades y acelera la escritura de código manteniendo la calidad y las mejores prácticas.

Contexto histórico: de IntelliSense a Copilot

El autocompletado de código existe desde finales de los años noventa. Microsoft introdujo IntelliSense en Visual Studio 97, basándose en análisis estático del código y en tablas de símbolos para sugerir métodos y propiedades. Durante más de veinte años, esta aproximación fue el estándar: rápida, determinista y limitada al conocimiento del propio editor sobre el lenguaje. La llegada de GitHub Copilot en 2021 rompió esta tradición al combinar un modelo de lenguaje entrenado con millones de repositorios públicos con el contexto del archivo abierto. Por primera vez, el editor podía proponer bloques completos basados en la intención del programador y no solo en la sintaxis. Entender esta diferencia ayuda a sacar partido a ambas herramientas, que hoy conviven en Visual Studio Code.

Atajos de teclado adicionales

Más allá de los atajos básicos, existen combinaciones útiles para trabajar con Copilot de forma más cómoda:

  • Tab: acepta la sugerencia completa.
  • Ctrl + →: acepta solo la siguiente palabra.
  • Ctrl + Enter: abre el panel Copilot: Open Completions Panel para ver hasta diez alternativas distintas a la vez.
  • Alt + \: fuerza a Copilot a generar una nueva sugerencia cuando no aparece automáticamente.
  • Esc: rechaza la sugerencia actual.
  • Alt + ] / Alt + [: navega entre sugerencias alternativas.
  • Ctrl + Shift + P y luego Copilot: Toggle Inline Suggestions: activa o desactiva temporalmente las sugerencias, ideal para momentos de concentración profunda.

Ejemplo paso a paso: generar una función de validación con comentarios

Imagina que quieres crear una función para validar un número de IBAN español. El flujo con Copilot sería:

  1. Abre un archivo validators.js y escribe un comentario descriptivo: // Función que valida un IBAN español (24 caracteres, letras ES al inicio, dígitos de control MOD-97).
  2. Pulsa Enter y empieza a escribir function validarIban( para dar contexto adicional.
  3. Observa cómo Copilot genera una implementación completa con la validación del prefijo, la longitud y el cálculo del módulo 97.
  4. Pulsa Ctrl + Enter para abrir el panel de alternativas y compara hasta diez sugerencias distintas.
  5. Selecciona la más clara, por ejemplo una que use expresiones regulares combinadas con BigInt para el cálculo.
  6. Pulsa Tab para aceptarla y añade manualmente un caso de test con un IBAN válido y otro inválido.
  7. Ejecuta los tests con Ctrl + Shift + B para confirmar que la función devuelve los resultados esperados.

En menos de dos minutos habrás obtenido una función robusta, documentada y testeada.

Tabla comparativa: IntelliSense frente a Copilot

| Aspecto | IntelliSense tradicional | GitHub Copilot | |---------|--------------------------|-----------------| | Fuente del conocimiento | Tablas de símbolos del proyecto | Modelo entrenado con código público | | Alcance de la sugerencia | Palabras, métodos, propiedades | Líneas y bloques completos | | Contexto considerado | Archivo y dependencias directas | Archivo, pestañas abiertas y comentarios | | Velocidad | Instantánea | Latencia de red (~200-800 ms) | | Coste | Gratuito | Suscripción mensual | | Privacidad | Totalmente local | Código enviado a servidores | | Determinismo | Alta | Baja (puede variar entre ejecuciones) |

Errores comunes al usar Copilot

A pesar de lo práctico que resulta, hay varios tropiezos que conviene evitar:

  • Aceptar sugerencias sin leerlas: Copilot puede generar código que compila pero no hace lo que esperas; revisa siempre el resultado antes de continuar.
  • Confiar en las sugerencias para código de seguridad: las validaciones de contraseñas, tokens o criptografía deben revisarse con especial cuidado.
  • Ignorar las licencias del código entrenado: en repositorios empresariales, conviene consultar la política de uso de Copilot for Business para evitar problemas legales.
  • Depender excesivamente del autocompletado: si dejas de razonar sobre el código, perderás habilidades fundamentales que Copilot no puede reemplazar.
  • Escribir comentarios demasiado vagos como // hacer algo, que producen sugerencias igualmente vagas y poco útiles.

Mejores prácticas en equipos

En entornos colaborativos, Copilot puede aportar mucho si se usa con criterio. Algunas recomendaciones clave:

  • Establecer una política común sobre cuándo aceptar sugerencias automáticas y cuándo no (por ejemplo, nunca en archivos de configuración sensibles).
  • Configurar Copilot for Business para que no envíe código de repositorios privados a los servidores públicos.
  • Revisar las sugerencias en las revisiones de pull requests como cualquier otro cambio; el hecho de que venga de una IA no exime de responsabilidad.
  • Compartir prompts y comentarios efectivos entre el equipo para establecer un estilo común que mejore la calidad de las sugerencias.
  • Combinar Copilot con linters y formateadores automáticos para garantizar que el código aceptado siga las normas del proyecto, independientemente de cómo lo haya sugerido el modelo.

Fuentes y referencias

Documentación oficial y recursos externos para profundizar en Visual Studio Code

Documentación oficial de Visual Studio Code
Alan Sastre - Autor del tutorial

Alan Sastre

Ingeniero de Software y formador, CEO en CertiDevs

Ingeniero de software especializado en Full Stack y en Inteligencia Artificial. Como CEO de CertiDevs, Visual Studio Code es una de sus áreas de expertise. Con más de 15 años programando, 6K seguidores en LinkedIn y experiencia como formador, Alan se dedica a crear contenido educativo de calidad para desarrolladores de todos los niveles.

Más tutoriales de Visual Studio Code

Explora más contenido relacionado con Visual Studio Code y continúa aprendiendo con nuestros tutoriales gratuitos.

Aprendizajes de esta lección

Comprender qué son las code completions y cómo funcionan en GitHub Copilot. Aprender a visualizar, aceptar y rechazar sugerencias de código. Navegar entre múltiples alternativas de sugerencias para un mismo contexto. Utilizar comentarios descriptivos para obtener sugerencias más precisas. Conocer las mejores prácticas para optimizar las sugerencias en diferentes lenguajes de programación.