title: Typescript Generic Array Type and Push Item
body: <p>I'm trying to create a generic function which handles varies arrays of various types (that only share a few properties in common) and perform simple operations such as delete or add an item. How should the typing's look for such a function?</p>
  
  <pre class="lang-js prettyprint-override"><code>interface A {
      value: number;
      aasdsad?: number;
      abc: string;
  }
  
  interface B {
      value: number;
      asdsad1?: string;
  }
  
  export class Main {
  
      public getOneOfTheArrays(): A[] | B[] {
          return []; // return A[] or B[] depending on certain conditions
      }
  
      public getValue(index: number) {
          const arr: A[] | B[] = this.getOneOfTheArrays();
          const a = this.copy(arr[index]);
          a.value = 1234;
          arr.push(a); // &lt;- typing's error here
      }
  
      public copy(obj: A | B): A | B {
          return Object.assign({}, obj);
      }
  
  }
  </code></pre>
  
  <p><a href="https://www.typescriptlang.org/play/index.html#src=interface%20A%20%7B%0D%0A%20%20%20%20value%3A%20number%3B%0D%0A%20%20%20%20aasdsad%3F%3A%20number%3B%0D%0A%20%20%20%20abc%3A%20string%3B%0D%0A%7D%0D%0A%0D%0Ainterface%20B%20%7B%0D%0A%20%20%20%20value%3A%20number%3B%0D%0A%20%20%20%20asdsad1%3F%3A%20string%3B%0D%0A%7D%0D%0A%0D%0Aexport%20class%20Main%20%7B%0D%0A%0D%0A%20%20%20%20public%20getOneOfTheArrays()%3A%20A%5B%5D%20%7C%20B%5B%5D%20%7B%0D%0A%20%20%20%20%20%20%20%20return%20%5B%5D%3B%20%2F%2F%20return%20A%5B%5D%20or%20B%5B%5D%20depending%20on%20certain%20conditions%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%20%20%20%20public%20getValue(index%3A%20number)%20%7B%0D%0A%20%20%20%20%20%20%20%20const%20arr%3A%20A%5B%5D%20%7C%20B%5B%5D%20%3D%20this.getOneOfTheArrays()%3B%0D%0A%20%20%20%20%20%20%20%20const%20a%20%3D%20this.copy(arr%5Bindex%5D)%3B%0D%0A%20%20%20%20%20%20%20%20a.value%20%3D%201234%3B%0D%0A%20%20%20%20%20%20%20%20arr.push(a)%3B%20%2F%2F%20%3C-%20typing&#39;s%20error%20here%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%20%20%20%20public%20copy(obj%3A%20A%20%7C%20B)%3A%20A%20%7C%20B%20%7B%0D%0A%20%20%20%20%20%20%20%20return%20Object.assign(%7B%7D%2C%20obj)%3B%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%7D" rel="nofollow noreferrer">DEMO1</a> <a href="https://www.typescriptlang.org/play/index.html#src=interface%20A%20%7B%0D%0A%20%20%20%20id%3F%3A%20string%3B%0D%0A%20%20%20%20value%3A%20number%3B%0D%0A%20%20%20%20a%3A%20string%3B%0D%0A%7D%0D%0A%0D%0Ainterface%20B%20%7B%0D%0A%20%20%20%20value%3A%20number%3B%0D%0A%7D%0D%0A%0D%0Adeclare%20type%20Get%3CT%3E%20%3D%20T%20extends%20A%20%3F%20A%5B%5D%20%3A%20B%5B%5D%3B%0D%0A%0D%0Aexport%20class%20Main%20%7B%0D%0A%0D%0A%20%20%20%20public%20bob%3CT%3E()%3A%20Get%3CT%3E%20%7B%0D%0A%20%20%20%20%20%20%20%20return%20%5B%5D%20as%20Get%3CT%3E%3B%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%20%20%20%20public%20getValue%3CT%20extends%20A%20%7C%20B%3E(index%3A%20number)%20%7B%0D%0A%20%20%20%20%20%20%20%20const%20arr%3A%20Get%3CT%3E%20%3D%20this.bob()%3B%0D%0A%20%20%20%20%20%20%20%20if%20(arr)%20%7B%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20a%20%3D%20this.copy(arr%5Bindex%5D)%3B%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20a.value%20%3D%201234%3B%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20arr.push(a)%3B%0D%0A%20%20%20%20%20%20%20%20%7D%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%20%20%20%20public%20copy(obj%3A%20A%20%7C%20B)%3A%20A%20%7C%20B%20%7B%0D%0A%20%20%20%20%20%20%20%20return%20Object.assign(%7B%7D%2C%20obj)%3B%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%7D" rel="nofollow noreferrer">DEMO2</a></p>
  
  <p><strong>Error:</strong> <code>arr.push(a)</code> -> Argument of type 'A | B' is not assignable to parameter of type 'A &amp; B'.
    Type 'B' is not assignable to type 'A &amp; B'.
      Property 'abc' is missing in type 'B' but required in type 'A'.</p>
  
  <p><strong>Solution so far:</strong> <code>(arr as typeof a[]).push(a);</code></p>