How to iterate over known property keys in TypeScript?

Question

This is my code:

interface Siswa {
  name: string,
  points: { a: number, b: number, c: number, d?: number, e?: number }
}

function find_average_points(data: Array<Siswa>): Array<{name: string, average: number}> {
  let returned_array: Array<{name: string, average: number}> = [];
  data.forEach((item: Siswa) => {
    let sum: number = 0;
    let keys = Object.keys(item.points);
    keys.forEach((key: any) => sum+=item.points[key]);
    returned_array.push({name: item.name, average: (sum/keys.length)});
  });
  return returned_array;
}

When I tried this function in JavaScript, it ran correctly and the result is what I want, but in TypeScript, I got an error in item.points[key]. It says:

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ a: number; b: number; c: number; d?: number | undefined; e?: number | undefined; }'.
  No index signature with a parameter of type 'string' was found on type '{ a: number; b: number; c: number; d?: number | undefined; e?: number | undefined; }'

I don't know what it means.

Answer 1

Using Object.keys() returns the type string[] (as explained in this comment). Instead, you can create arrays for the known keys in the points object, use them to build your types, and then loop through those keys when summing the values:

TS Playground link

const definitePoints = ['a', 'b', 'c'] as const;
const maybePoints = ['d', 'e'] as const;

type Points = (
  Record<typeof definitePoints[number], number>
  & Partial<Record<typeof maybePoints[number], number>>
);

interface Siswa {
  name: string,
  points: Points;
}

interface SiswaAverage {
  name: string;
  average: number;
}

function find_average_points (data: Array<Siswa>): Array<SiswaAverage> {
  const result: Array<SiswaAverage> = [];

  for (const {name, points} of data) {
    let sum = 0;
    let count = 0;

    for (const point of [...definitePoints, ...maybePoints]) {
      const value = points[point];
      if (typeof value !== 'number') continue;
      sum += value;
      count += 1;
    }

    result.push({name, average: sum / count});
  }

  return result;
}