Logo de Código Facilito
  • Inicio
  • Replays
  • Iniciar sesión
  • Crear cuenta
  • Explorar cursos
  • Bootcamps
  • Precios
  • Blog

¡Califica el Curso Profesional de React (legado)!

Selecciona la calificación de 1 a 5 estrellas

Reporta un error

Curso Curso Profesional de React (legado)

Video Qué son los componentes de clase

Tipo de error

Algo salió mal al cargar el vídeo

El vídeo no pudo cargarse, hemos enviado un reporte al equipo de desarrollo, para poder solucionarlo a la brevedad.

Mientras solucionamos el problema, intenta lo siguiente para solucionar el error:

  • Recarga la página
  • Intenta reiniciar tu navegador y luego vuelve a reproducir el vídeo
  • Vacía el caché de tu navegador
  • Intenta reproducir con las extensiones del navegador deshabilitadas
  • Intenta con un navegador distinto
  • Si el problema persiste contáctanos en Discord
home Ir al inicio report_problem Reportar falla star Valorar curso

Un componente de clase es aquél que está definido con una clase de JavaScript. Esta clase debe tener dos particularidades:

  • Primero, debe ser una clase de ES6 de JavaScript que herede de React.Component
  • Debe poder implementar un método render() que retorne los elementos de React para la interfaz de dicho componente.

Históricamente, un componente de clase se diferencía de un componente funcional en dos principales cosas: La capacidad de administrar un estado propio del componente y la exposición de métodos que pueden ejecutar funcionalidad personalizada en distintas etapas del ciclo de vida de un componente.

Sin embargo, con la introducción de hooks en React 16, los componentes funcionales homologaron la funcionalidad de los componentes de clase en que ahora también pueden guardar un estado y ejecutar métodos del ciclo de vida de un componente.

En ese sentido, gran parte de la comunidad de desarrolladores que usan React, recomiendan usar componentes funcionales y hooks, en lugar de componentes de clase. Al mismo tiempo, el equipo que mantiene y desarrolla React, recomienda que no se re escriban componentes de clase en componentes funcionales a menos que sea necesario.

Esto quiere decir que en el futuro, React soportará ambas formas de declarar un método, con clases y con funciones. Esto significa que para un desarrollador nuevo de React es necesario conocer ambas formas de declarar componentes ya que es probable que en su trabajo día a día se encuentre con componentes de clase y componentes funcionales como parte de una misma aplicación.

Por último, cabe mencionar que algunos conceptos de React son más claros cuando se observan a través de la definición en un componente de clase, particularmente los métodos del ciclo de vida de un componente.

  • check_circle_outline
    Módulo 1 | 4 clases

    Introducción

    expand_more
  • check_circle_outline
    Módulo 2 | 7 clases

    JSX - Templates

    expand_more
  • check_circle_outline
    Módulo 3 | 10 clases

    Componentes

    expand_more
  • check_circle_outline
    Módulo 4 | 3 clases

    Formularios

    expand_more
  • check_circle_outline
    Módulo 5 | 4 clases

    Code splitting

    expand_more
  • check_circle_outline
    Módulo 6 | 4 clases

    React context

    expand_more
  • check_circle_outline
    Módulo 7 | 3 clases

    Cómo funciona React

    expand_more
  • check_circle_outline
    Módulo 8 | 7 clases

    Componentes de clase

    expand_more
    • done_all

      Clase 1

      Qué son los componentes de clase

    • done_all

      Clase 2

      Cómo definir un componente de clase

    • done_all

      Clase 3

      Trabajando con props

    • done_all

      Clase 4

      Trabajando con el estado

    • done_all

      Clase 5

      Preservando el contexto

    • done_all

      Clase 6

      Métodos del ciclo de vida de un componente

    • done_all

      Clase 7

      Ciclo de vida en un componente funcional

  • check_circle_outline
    Módulo 9.-

    Examen del curso

    expand_more
    • done_all

      Examen

      Examen final del curso

Qué son los componentes de clase

arrow_back Siguiente arrow_forward
Curso Profesional de React (legado)