zoukankan      html  css  js  c++  java
  • [TypeScript] Using Assertion to Convert Types in TypeScript

    Sometimes the compiler needs help figuring out a type. In this lesson we learn how to help out the compiler with Typescript type assertion.

    We have a SuperHero and a BadGuy. Let's make a function that saves the day if the function's argument is a SuperHero, and a commits a bad deed if its argument is a BadGuy. Our function needs to accept something that could be a SuperHero or a BadGuy.

    interface SuperHero {
      powers: string[];
      savesTheDay: () => void;
    }
    
    interface BadGuy {
      badDeeds: string[];
      getRandomBadDeed: () => string;
      commitBadDeed: () => void;
    }
    
    function saveDayOrBadDeed(something: SuperHero | BadGuy) {
      if (something.powers) {}
    }

    The IDE is telling us something's wrong. 

    assertion.ts(24,19): error TS2339: Poperty 'powers' does not exist on type 'SuperHero | BadGuy'.

    This is because the compiler is evaluating both types of the union-type argument. Since the BadGuy doesn't have powers, something doesn't have powers. We can get a hold of the SuperHero's power's property by asserting that something is a SuperHero.

    An assertion is how we told the compiler, "We have some information about something's type that it doesn't." There are two different syntaxes for assertion. We're using the as type syntax, which goes behind the value. We're putting something in parens in order to isolate it from its property. If we remove the parens we can't make the assertion.

    function saveDayOrBadDeed(something: SuperHero | BadGuy) {
      if ((something as SuperHero).powers) {}
    }
    
    //or 
    
    if (<SuperHero>something.powers) {} // angle bracket syntax, doesn't work with JSX
    function saveDayOrBadDeed(something: SuperHero | BadGuy) {
      if ((something as SuperHero).powers) {
        (something as SuperHero).savesTheDay();
      } else {
        (something as BadGuy).commitBadDeed();
      }
    }
    
    saveDayOrBadDeed(dazzler); // Dazzler transduces sonic vibrations into light to save the day!!!
    saveDayOrBadDeed(badGuy); // BadGuy farts on old folks
  • 相关阅读:
    [收藏] WAP网关应用
    关于Symbian编程的基础知识— 基本数据类型
    PDU短信的编码一般规则
    同级方法异步调用(2016.05.04更新)
    OpenStack Manila发展动态系列Austin峰会
    OpenStack Cinder发展动态系列Austin峰会
    OpenStack Neutron单网卡桥接模式访问外网
    每日一测3(结构和类的异同)
    每日一测2(关于构造函数)
    每日一测1(带命令行参数运行)
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5961916.html
Copyright © 2011-2022 走看看