Fundamentos de TypeScript 🦆| #8: Tipos Literales

Como vimos ya TypeScript soporta la unión de tipos para que una variable pueda tener varios tipos de datos diferentes.

Los Tipos Literales son básicamente lo mismo, pero lo limitamos por lo general, a valores concretos, por ejemplo:

let operaciones:string = "suma";

operaciones soporta cualquier string, es este caso la cadena "suma"

En el último ejemplo operaciones puede contener "resta", "multiplicacion" o "division", como también "manzana", "payaso" o "tomate", todos son cadenas válidas, pero no todas son cadenas apropiadas para nuestra variable. Por ello podemos usar Tipos Literales para limitar aun más los valores que puede admitir la variable operaciones.

Veamos otro ejemplo:
Tenemos una función concatOrSumValues que concatena los valores si son string y los suma si son number:

function concatOrSumValues(value1:number | string, value2:number | string, placeholder:string = 'to-sum'):number | string {
  let res;
  if(placeholder === 'to-sum'){
    res = +value1 + +value2
  }else{
    res = value1.toString() +  value2.toString();
  }
  return res;
}

console.log(concatOrSumValues(2,2)); //4
console.log(concatOrSumValues("2","2", 'to-concat')); // "22"

La función depende del parámetro placeholder, que por defecto es to-sum ergo la función sumará los valores por defecto.

Pero placeholder puede recibir cualquier cadena, ¿cómo podemos limitarlo a que solo pueda recibir to-sum para la suma, y to-concat para la concatenación? Acá entran los Tipos Literales.

Podríamos hacer algo como esto:

type StringOrNumber = string | number; //unión de tipos
type PlaceholderOperation = 'to-sum' | 'to-concat' // unión de tipos literales

function concatOrSumValues(value1:StringOrNumber, value2:StringOrNumber,placeholder:PlaceholderOperation = 'to-sum'):StringOrNumber {
  let res;
  if(placeholder === 'to-sum'){
    res = +value1 + +value2
  }else{
    res = value1.toString() +  value2.toString();
  }
  return res;
}

console.log(concatOrSumValues(2,2)); // 4
console.log(concatOrSumValues("2","2", 'to-concat')); // '22'
console.log(concatOrSumValues("3","3", 'to-conca')); // Argument of type '"to-conca"' is not assignable to parameter of type 'PlaceholderOperation'

PlaceholderOperation solo puede recibir 2 cadenas específicas: to-sum o to-concat, cualquier otro string será un error.

Conclusiones

• Los tipos literales reducen más los posibles valores que puede aceptar una variable.
• Son muy comunes y muy usados para aprovechar al máximo los beneficios de TypeScript.

Referencias