TypeScript
Continuamos aprendiendo TypeScript, y hoy es el turno de los genéricos, una recurso que facilita la reutilización de componentes, porque en realidad, gran parte del trabajo de ingeneria de software consiste no solo de definir una API que además sea consistente, sino que en la medida de las posibilidades también sea reutilizable. La virtud principal es crear componentes que sean capaces de trabajar con datos de hoy, pero también con los datos futuros, facilitando la flexibilidad requerida para escribir largas aplicaciones web..
En lenguajes como C# y Java, una de las herramientas principales para la creación de herramientas reutilizable son …
genericos: se trata de crear componentes que permiten trabajar con una variedad de tipos, en lugar de uno solo, lo que permite usar estas estructuras para incluso definir tipos propios..
Genericos
Los genéricos tienen la habilidad de definit plantillas de código que pueden ser reutilizadas como base, añadiendo una gran funcionalidad. Al igual que con las interfaces, los genericos sólo actúan en compilación, porque no tienen código asociado Javascript, pero a su vez, permiten flexibilidad para trabajar con tipos definidos por el usuario según sus necesidades (tanto en clases como en funciones).
Uno de los usos fundamentales de los genericos es minimizar el uso del tipo any.
Veamos un pequeño ejemplo de generico con una función que devuelve el mismo tipo que recibe (como el comando ‘echo’). Si se usa ‘any‘, la variable admite cualquier tipo, pero estamos perdiendo información sobre el tipo que devuelve. Así que, si es definida como generica, sabemos que si pasamos un número, la devolución será del mismo tipo, es decir, un número. Para definir el genérico se usa type variable, un tipo especial de variable que permite trabajar con cualquier tipo.
function identity<T>(arg: T): T {
return arg;
}
Hemos incluido el tipo identificándolo con la variable ‘T’ en la función. Esta ‘T‘ permite al desarrollador conocer el tipo con el que va a trabajar la variable (por ejemplo, un número), de forma que pueda ser utilizado después. Así mismo, se usa también ‘T’ como el tipo que devuelve. De esta forma podemos conocer al escribir código lo que espera y lo que devuelve, según el tipo definido. Así se reduce las probabilidades de errores.
Una vez que está definida la función genérica, existen dos funciones de llamar a la función: la primera es incluyendo el tipo de argumento de la función explícitamente como ‘T’ (en este caso, como cadena o string), entre <>:
var output = identity<string>("myString"); // type of output will be 'string'
La segunda forma es más común, y el tipo es inferido (/type argument inference/), o sea, que es el compilador el que evalúa T:
var output = identity("myString"); // type of output will be 'string'
En este caso, no se ha explicitado el tipo entre <>, sino que el compilador lo deduzca. El consejo es que se utiliza la forma explícita para reducir los errores de compilación, pero … no siempre es posible.
Creando listas usando genericos
Uno de los usos de los genéricos es a la hora de crear clases que simulan listas.
class ListOfNumbers {
_items: number[] = [];
add(item: number) { this._items.push(item);}
getItem(): number[] { return this._items; }</pre>
</div>
}
Ahora, imagina que en lugar de una lista de números, queremos lo mismo pero de cadenas. El código es muy similar:
class ListOfStrings {
_items: string[] = [];
add(item: string) { this._items.push(item);}
getItem(): string[] { return this._items; }</pre>
}
Si comparas ambos códigos, la única diferencia es el tipo: en uno es numerico y en otro cadena. Vamos a reescribir la clase usando genéricos::
class Lists<T> {
_items: <T>[] = [];
add(item:<T>) { this._items.push(item);}
getItem(): <T>[] { return this._items; }</pre>
}
Ahora, puedes usar esta clase indicando el tipo a utilizar al crear la variable, y con solo una definición de clase!!
</div> var miList = new Lists<number>(); var miListString = new Lists<string>();
Como bien puedes imaginar, el uso de genericos es en las clases, funciones e interfaces, por lo que te interesa aprender su uso, para reutilizar código!
Y esto es todo por ahora! Happy coding!