IntelliSense

IntelliSense: qué es y qué opciones ofrece

IntelliSense es el sistema de asistencia inteligente de código integrado en Visual Studio Code que proporciona sugerencias contextuales mientras escribes. Esta funcionalidad analiza el código en tiempo real y ofrece autocompletado automático, información de parámetros y documentación instantánea para acelerar el desarrollo y reducir errores.

El sistema se activa automáticamente cuando comienzas a escribir código. No requiere configuración inicial y funciona de forma transparente en segundo plano, analizando el contexto actual del archivo y proporcionando sugerencias relevantes basadas en el lenguaje de programación que estés utilizando.

Tipos de sugerencias disponibles

IntelliSense ofrece diferentes categorías de sugerencias contextuales que se adaptan al código que estás escribiendo:

Variables y constantes: Cuando escribes el inicio de una variable ya declarada, IntelliSense muestra todas las variables disponibles en el ámbito actual. Por ejemplo, si has declarado let userName = "Juan", al escribir user aparecerá la sugerencia completa.

Funciones y métodos: El sistema reconoce las funciones disponibles y muestra sus firmas completas con información sobre parámetros requeridos. Esto incluye tanto funciones propias como métodos nativos del lenguaje.

Snippets básicos: Son plantillas de código predefinidas que se expanden automáticamente. Por ejemplo, escribir for en JavaScript mostrará opciones para generar diferentes tipos de bucles con la estructura completa.

Palabras clave del lenguaje: IntelliSense sugiere automáticamente las palabras reservadas del lenguaje actual, como function, class, if, else, según el contexto donde te encuentres.

Navegación en las sugerencias

La lista de sugerencias aparece automáticamente mientras escribes y puedes navegar por ella de varias formas eficientes:

Las teclas de flecha (↑ ↓) te permiten moverte por la lista de sugerencias. La opción seleccionada se resalta visualmente y muestra información adicional en un panel lateral.

Enter acepta la sugerencia seleccionada y la inserta en el código, reemplazando el texto parcial que habías escrito. Esta es la forma más común de aplicar una sugerencia.

Tab también acepta la sugerencia, pero con un comportamiento ligeramente diferente: reemplaza completamente la palabra actual, lo que resulta útil cuando quieres sobrescribir texto existente.

Escape cierra la lista de sugerencias sin aplicar ninguna, permitiéndote continuar escribiendo manualmente.

Parameter hints y signature help

Cuando escribes el nombre de una función seguido de un paréntesis de apertura, IntelliSense activa automáticamente los parameter hints. Esta funcionalidad muestra una ventana emergente con información detallada sobre los parámetros que acepta la función.

// Al escribir Math.max( aparece la ayuda de parámetros
Math.max(value1, value2, ...valueN)

La signature help resalta el parámetro actual que estás escribiendo, facilitando la comprensión de qué valor debes proporcionar en cada posición. Si una función tiene múltiples sobrecargas, puedes navegar entre ellas usando las flechas que aparecen en la ventana de ayuda.

Quick info con hover

Al posicionar el cursor sobre cualquier elemento del código sin hacer clic, IntelliSense muestra información contextual en una ventana emergente. Esta funcionalidad, conocida como hover, proporciona detalles instantáneos sobre variables, funciones y tipos de datos.

Para variables, muestra el tipo de dato y el valor actual si está disponible. Para funciones, presenta la signatura completa con descripción de parámetros y valor de retorno. Esta información aparece sin interrumpir tu flujo de trabajo.

Configuración básica

IntelliSense incluye opciones de configuración accesibles que permiten personalizar su comportamiento según tus preferencias de desarrollo.

Puedes acceder a la configuración a través de File > Preferences > Settings y buscar "IntelliSense". Las opciones más relevantes incluyen:

Editor: Quick Suggestions: Controla cuándo aparecen las sugerencias automáticamente. Puedes configurarlo para que se active en strings, comentarios o solo en código.

Editor: Suggest On Trigger Characters: Define qué caracteres activan automáticamente las sugerencias. Por defecto incluye el punto (.) para acceder a propiedades de objetos.

Editor: Accept Suggestion On Enter: Determina si Enter acepta sugerencias o simplemente crea una nueva línea. Puedes configurarlo como "on", "off" o "smart".

Soporte para diferentes lenguajes

IntelliSense adapta automáticamente sus sugerencias según el lenguaje de programación del archivo actual, proporcionando experiencias específicas y optimizadas.

HTML: Ofrece autocompletado de etiquetas, atributos y valores. Al escribir <div sugiere el cierre automático y atributos comunes como class e id. También valida la estructura del documento y sugiere etiquetas apropiadas según el contexto.

CSS: Proporciona sugerencias de propiedades, valores y selectores. Al escribir color: muestra opciones de colores válidos, incluyendo nombres predefinidos y formatos como hex y rgb. También sugiere clases CSS definidas en el proyecto.

JavaScript: Incluye soporte completo para variables, funciones, objetos y APIs del navegador. Reconoce la sintaxis moderna de ES6+ y proporciona sugerencias para métodos de arrays, promesas y sintaxis de destructuring.

El sistema detecta automáticamente el lenguaje basándose en la extensión del archivo y ajusta las sugerencias en consecuencia, proporcionando una experiencia de desarrollo fluida y contextualmente relevante para cada tecnología.