javascript - Interfaz de Typescript establece valores basados en la lógica
Tengo una interfaz de TypeScript que está definida como:
interface FutureProjection{
month1: number;
month2: number;
.
.
.
.
.
.
month12: number;
}
Estos datos se utilizan para mostrar la cuadrícula en la interfaz de usuario. Tengo una lógica que se utiliza para averiguar qué mes establecer los datos:
calculateMonthNum(currentDate:String,futureDate: String):number{
//Calculate the month difference between future and current.
return monthDiff;
}
functionToSetMonthData(currentDate:String,futureDate: String, projection: FutureProjection, amount: number): FutureProjection{
const monthNum = calculateDiff(currentDate,futureDate);
****//How to do this?? vvvv **
projection.month+monthNum = amount; //. <---This assignment operation???
return projection;
}
Respuesta #1
Siempre puedes usar la sintaxis de corchetes para acceder a una propiedad de cualquier objeto de JavaScript.
// identical
projection['month1']
projection.month1
Lo que significa que puedes construir una cadena que sea el nombre de la propiedad y usarla entre corchetes:
projection[`month${monthNum}`] = amount;
Pero en TypeScript eso solo te lleva a la mitad del camino. Esto te dará un error de tipo:
type 'string' can't be used to index type 'FutureProjection'.
El problema es que FutureProjection no se puede indexar por string, solo se permiten cadenas específicas. Así que TypeScript no sabe que month$ {monthNum} es una cadena específica que en realidad es válida, ya que monthNum podría ser cualquier número (-5, 0, 100, 3.14159, etc).
La forma más fácil de resolver eso es convertir la cadena de la clave a un keyof FutureProjection. Ten en cuenta que, para que esto sea seguro, debes asegurarte de que calculateDiff() solo devuelva enteros del 1 al 12.
Eso se parece a algo así:
function setMonthData(currentDate:String,futureDate: String, projection: FutureProjection, amount: number): FutureProjection{
const monthNum = calculateDiff(currentDate, futureDate);
const monthKey = `month${monthNum}` as keyof FutureProjection
projection[monthKey] = amount;
return projection;
}
Ejemplo funcional en el playground de TypeScript
Dicho esto, puede que te resulte más fácil usar un arreglo en su lugar.
Respuesta #2
Puedes lograr eso de la siguiente manera:
projection[`month${monthNum}`] = amount;
