title: Accessing objects field using string in Typescript
body: <p>I am having a class consisting of multiple public members.</p>
  <p>for simplicity let's assume:</p>
  <pre><code>class ComponentData {
    id: number;
    type: ComponentType;
    location: ComponentLocation;
    label: string;
    value: number;
  }
  </code></pre>
  <p>I do have a type defined:</p>
  <pre><code>type Layout = {[field in keyof ComponentData]?: InputSchema};
  </code></pre>
  <p>Using <code>Object.keys(layout)</code> I am displaying different set of inputs for different ComponentTypes. This works great, however later on input <code>onChange</code> I am trying to modify the source ComponentData.</p>
  <pre><code>function onPropertyChange(newValue: unknown, fieldName: string) {
      selectedItem[fieldName] = newValue;
  }
  </code></pre>
  <p>I am receiving:</p>
  <blockquote>
  <p>TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'ComponentData'.   No index signature with a parameter of type 'string' was found on type 'ComponentData'.</p>
  </blockquote>
  <p>I tried to follow the solution suggested here:
  <a href="https://stackoverflow.com/a/66838662/8191341">https://stackoverflow.com/a/66838662/8191341</a>
  as follows:</p>
  <pre><code>function onPropertyChange(newValue: unknown, fieldName: string) {
      const key = fieldName as keyof ComponentData;
      selectedItem![key] = newValue;
  }
  </code></pre>
  <p>but then received:</p>
  <blockquote>
  <p>TS2322: Type 'InputValues' is not assignable to type 'never'.   Type 'undefined' is not assignable to type 'never'.</p>
  </blockquote>
  <p>Any ideas? :)</p>
  <p>PS. Using //@ts-ignore it works as expected but I am not happy with the solution.</p>