title: Typescript: understanding union and Intersection types
body: <p>I am trying to get an intuition about Union and Intersection types in typescript, but I can't figure out this case: <a href="https://www.typescriptlang.org/play/?ssl=17&amp;ssc=1&amp;pln=1&amp;pc=1#code/JYOwLgpgTgZghgYwgAgILIN4Chm+XALmRAFcBbAI2gG4sBfLLUSWRFAIWz2QqIoHt+AGwhwQtBoyxgAngAcUAVRDB+IAML9KoCABMAKvJQBeNMgA+ydrSwI1AZzDJ+FAFZFlqjVoo6DR5FMuPEJkADYAGhw8XmQwKBIIKIYgA" rel="noreferrer">Playground Link</a></p>
  
  <pre class="lang-js prettyprint-override"><code>interface A {
      a: number;
  }
  
  interface B{
      b: boolean;
  }
  
  
  
  type UnionCombinedType = A | B;
  type IntersectionType = A &amp; B;
  
  const obj: UnionCombinedType = {
      a: 6,
      b: true,
  }
  
  const obj2: IntersectionType = {
      a: 6,
      b: true,
  }
  
  </code></pre>
  
  <p>Why am I allow to put both values in the intersection type? The intersection between the two interfaces is empty. If I read the <code>&amp;</code> as <code>AND</code> then it's clear to me why it allows me to add both props, but then I should read the <code>|</code> keyword as <code>OR</code> and I would expect it to allow me to assign only <code>a</code> or <code>b</code> but not both.</p>
  
  <p>Can someone give me some intuition about those types?</p>