Hemos recorrido un largo camino en el aprendizaje de TypeScript desde el inicio de esta serie. El primer tutorial le dio una breve introducción de TypeScript y sugirió algunas IDE que puede usar para escribir TypeScript. El segundo tutorial se centró en los tipos de datos y el tercer tutorial trató los conceptos básicos de las interfaces en TypeScript.
Como ya sabrá, JavaScript solo ha agregado recientemente soporte nativo para clases y programación orientada a objetos. Sin embargo, TypeScript ha permitido a los desarrolladores utilizar clases en su código durante mucho tiempo. Este código luego se compila en JavaScript que funcionará en todos los principales navegadores. En este tutorial, aprenderá sobre las clases en TypeScript. Son similares a sus contrapartes ES6 pero son más estrictos.
Empecemos con lo básico. Las clases son una parte fundamental de la programación orientada a objetos. Las clases se utilizan para representar cualquier entidad que tenga algunas propiedades y funciones que puedan actuar en determinadas propiedades. TypeScript le da control total sobre las propiedades y funciones que son accesibles dentro y fuera de su propia clase contenedora. Aquí hay un ejemplo muy básico de crear un Persona
clase.
clase Persona nombre: cadena; constructor (theName: string) this.name = theName; introduceSelf () console.log ("Hola, soy" + this.name + "!"); let personA = new Person ("Sally"); personA.introduceSelf ();
El código anterior crea una clase muy simple llamada Persona
. Esta clase tiene una propiedad llamada nombre
y una función llamada presentarse
. La clase también tiene un constructor, que también es básicamente una función. Sin embargo, los constructores son especiales porque se llaman cada vez que creamos una nueva instancia de nuestra clase.
También puede pasar parámetros a los constructores para inicializar diferentes propiedades. En nuestro caso, estamos usando el constructor para inicializar el nombre de la persona que estamos creando usando el Persona
clase. los presentarse
La función es un método de la Persona
clase, y lo estamos utilizando aquí para imprimir el nombre de la persona en la consola. Todas estas propiedades, métodos y el constructor de una clase se denominan colectivamente miembros de clase.
Debes tener en cuenta que Persona
La clase no crea automáticamente una persona por sí misma. Actúa más como un plano con toda la información sobre los atributos que una persona debería haber creado una vez. Con eso en mente, creamos una nueva persona y la llamamos Sally. Llamando al método presentarse
en esta persona se imprimirá la línea "Hola, soy Sally!" a la consola.
En la sección anterior, creamos una persona llamada Sally. En este momento, es posible cambiar el nombre de la persona de Sally a Mindy en cualquier lugar de nuestro código, como se muestra en el siguiente ejemplo..
clase Persona nombre: cadena; constructor (theName: string) this.name = theName; introduceSelf () console.log ("Hola, soy" + this.name + "!"); let personA = new Person ("Sally"); // Impresiones "Hola, soy Sally!" personA.introduceSelf (); personA.name = "Mindy"; // Impresiones "Hola, soy Mindy!" personA.introduceSelf ();
Es posible que hayas notado que pudimos usar tanto nombre
propiedad y la presentarse
Método fuera de la clase contenedora. Esto se debe a que todos los miembros de una clase en TypeScript son público
por defecto. También puede especificar explícitamente que una propiedad o método es público agregando la palabra clave público
antes de eso.
A veces, no desea que una propiedad o método sea accesible fuera de su clase contenedora. Esto se puede lograr haciendo que los miembros sean privados usando el privado
palabra clave. En el código anterior, podríamos hacer la propiedad del nombre. privado
y evitar que se cambie fuera de la clase contenedora. Después de este cambio, TypeScript le mostrará un error que dice que el nombre
la propiedad es privado
y solo se puede acceder dentro de la Persona
clase. La siguiente captura de pantalla muestra el error en Visual Studio Code.
La herencia le permite crear clases más complejas a partir de una clase base. Por ejemplo, podemos usar el Persona
clase de la sección anterior como base para crear una Amigo
clase que tendrá todos los miembros de la Persona
y añadir algunos miembros propios. Del mismo modo, también podría agregar un Familia
o Profesor
clase.
Todos ellos heredarán los métodos y propiedades del Persona
mientras que agrega algunos métodos y propiedades propios para diferenciarlos. El siguiente ejemplo debería aclararlo. También he añadido el código para el Persona
clase aquí para que pueda comparar fácilmente el código de la clase base y la clase derivada.
clase Persona nombre privado: cadena; constructor (theName: string) this.name = theName; introduceSelf () console.log ("Hola, soy" + this.name + "!"); clase amigo extiende Persona años Conocido: número; constructor (nombre: cadena, yearsKnown: número) super (nombre); this.yearsKnown = yearsKnown; timeKnown () console.log ("Hemos sido amigos por" + this.yearsKnown + "years.") let friendA = new Friend ("Jacob", 6); // Estampas: ¡Hola, soy Jacob! friendA.introduceSelf (); // Estampados: Somos amigos desde hace 6 años. friendA.timeKnown ();
Como puedes ver, tienes que usar el ampliar
palabra clave para el Amigo
clase para heredar todos los miembros de la Persona
clase. Es importante recordar que el constructor de una clase derivada siempre debe invocar al constructor de la clase base con una llamada a súper()
.
Es posible que hayas notado que el constructor de Amigo
no necesitaba tener el mismo número de parámetros que la clase base. Sin embargo, el primer parámetro de nombre fue pasado a súper()
para invocar al constructor del padre, que también acepta un parámetro. No tuvimos que redefinir el presentarse
función dentro de la Amigo
clase porque fue heredado de la Persona
clase.
Hasta este punto, solo hemos hecho los miembros de una clase privado
o público
. Mientras que hacerlos públicos nos permite acceder a ellos desde cualquier lugar, hacer que los miembros sean privados los limita a su propia clase contenedora. A veces, es posible que desee que los miembros de una clase base sean accesibles dentro de todas las clases derivadas.
Puedes usar el protegido
modificador en tales casos para limitar el acceso de un miembro solo a las clases derivadas. También puedes usar el protegido
palabra clave con el constructor de una clase base. Esto evitará que alguien cree una instancia de esa clase. Sin embargo, todavía podrá ampliar las clases en función de esta clase base.
clase Persona nombre privado: cadena; edad protegida: número; constructor protegido (theName: string, theAge: number) this.name = theName; this.age = theAge; introduceSelf () console.log ("Hola, soy" + this.name + "!"); clase amigo extiende Persona años Conocido: número; constructor (nombre: cadena, edad: número, añosKnown: número) super (nombre, edad); this.yearsKnown = yearsKnown; timeKnown () console.log ("Hemos sido amigos por" + this.yearsKnown + "years.") friendSince () let firstAge = this.age - this.yearsKnown; console.log ('Hemos sido amigos desde que tenía $ firstAge años.') let friendA = new Friend ("William", 19, 8); // Estampados: Somos amigos desde los 11 años. friendA.friendSince ();
En el código anterior, se puede ver que hicimos el años
propiedad protegido
. Esto evita el uso de años
fuera de cualquier clase derivada de Persona
. También hemos utilizado el protegido
palabra clave para el constructor de la Persona
clase. Declarando al constructor como protegido
significa que ya no podremos instanciar directamente la Persona
clase. La siguiente captura de pantalla muestra un error que aparece al intentar crear una instancia de una clase con el protegido
constructor.
En este tutorial, he tratado de cubrir los conceptos básicos de las clases en TypeScript. Comenzamos el tutorial creando un muy básico. Persona
Clase que imprimió el nombre de la persona a la consola. Después de eso, aprendiste sobre el privado
palabra clave, que se puede utilizar para evitar que se acceda a los miembros de una clase en cualquier punto arbitrario del programa.
Finalmente, aprendió cómo extender diferentes clases en su código usando una clase base con herencia. Hay mucho más que puedes aprender sobre las clases en la documentación oficial..
Si tiene alguna pregunta relacionada con este tutorial, hágamelo saber en los comentarios..