title: TypeScript function returns multiple options
body: <p>I have a function as below and I can't wrap my head around it.  How can a function return multiple types and how are each used?</p>
  
  <pre><code>function(): Observable&lt;Type&gt; | Promise&lt;Type&gt; | Type {
  ...
  }
  </code></pre>
  
  <p>It looks like the pipe(|) is used to designate that multiple values can be returned.  What I don't understand is when is each used?  I suspect that the Observable is used when a <code>subscribe</code> is issued, the Promise is used by default, and the straight up Type is used when the function is called with <code>await</code>.</p>
  
  <p>If I'm right, great!  I can't seem to find documentation for this functionality so that I can learn more.  Can you help?  I suspect my issue is that I don't know what to Google search for.</p>
  
  <p><em>UPDATE: Additional Code Sample</em></p>
  
  <p>The following is a code sample where multiple return types are provided, but I only return the boolean type.</p>
  
  <pre><code>@Injectable()
  export class AuthGuard implements CanActivate, CanActivateChild {
  
    constructor(private authService: AuthService, private router: Router) { }
  
    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) :
        Observable&lt;boolean&gt; | Promise&lt;boolean&gt; | boolean {
          return this.authService.isAuthenticated()
            .then((authenticated: boolean) =&gt; {
              if (authenticated) {
                return true;
              } else {
                this.router.navigate(['/']);
              }
            });
          }
  
    canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) :
        Observable&lt;boolean&gt; | Promise&lt;boolean&gt; | boolean {
          return this.canActivate(route, state);
        }
  
  
  }
  </code></pre>
  
  <p>What is determining whether to return the <code>Type</code> as is, versus wrapping this in a Promise or Observable (for subscription)?</p>